【轻知识】php 后台的一次前后端分离

年前（阴历）新起的项目。三个phper写一个后台。前端资源紧张负责写h5了。没有跟后台配前端。其他两个小伙伴表示没怎么尝试过前后端分离。vue也是不会的。项目负责人的意思是。也可以用php渲染页面啥的。

我考虑到后续项目的维护性，扩展性以及开发速度。决定用前后端分离。但是自己也没实际用到项目中过。之前看过一个前端框架vue-element-admin觉得能hold住（我用vue是引入到项目用，之前都是半前后端分离。）。用一下午的时间，写了demo。快速看了下文档。因为我要hold住才能告诉别人怎么写。在phabricator上写了简单的如何快速上手（其实作者有系列教程）。我觉得所谓快速上手，就是你写个mvc。别人看了就会自己写就够了。至于熟悉，那是边写项目边多了解了。

实际上，我们上手很快，提升了开发速度。

技术

后端yaf 框架

前端vue-element-admin

部署

线上没有装node环境了。直接是本地编译线上代码npm run build prod。接口怎么区分呢？是根据域名区分的。也就是根据域名判断是测试还是线上。思路借鉴自我司前端同学。

调用后台的接口配置文件。我是在src目录下建了一个config目录，然后创建了一个api.js。

let UC_HOST = ''
let SHIP_HOST = ''
if (location.hostname.indexOf('waiter.net') > -1) {
  SHIP_HOST = 'http://cgi.net' // 正式接口
  UC_HOST = 'http://passport.net' // 正式接口
} else if (location.hostname.includes('dev') || location.hostname.includes('master')) {
  SHIP_HOST = 'http://dev-master.order-api.com'
  UC_HOST = 'http://dev-master.passport.com'// 测试接口
} else {
  SHIP_HOST = 'http://dev-master.order-api.com'
  UC_HOST = 'http://dev-master.passport.com'// 测试接口
}
export default {
  getUcApi(name) {
    return UC_HOST + this.ucApi[name]
  },
  getShipApi(name) {
    return SHIP_HOST + this.shipApi[name]
  },
  ucApi: {
    login: '/user/login',
    userInfo: '/user/get-user-info'
  },
  shipApi: {
    shipCompany: '/ship/get-ship-company'
  }
}

php部署就不说了。都会。这次运维用的docker。我对docker没有什么研究。