vue-cli脚手架里加入后端api测试接口

vue-cli本身也是用express搭建起来的本地服务器，为解决跨域的问题，直接在这个本地服务器下搭建模拟后端api的测试接口是最合适不过了。

在dev-server.js里，针对app加入相关api接口即可，举例如下：

app.get('/api/getName', functions(req, res, next) {

  res. send({name: 'camus'})

}) 

注意必须放在app.use(require('connect-history-api-fallback')())这个中间件之前，不然“/api/getName”此路由则被express处理至vue-cli入口页面做前端路由处理去了。

为模块化起见，针对app相关后端api的处理可封装至单独文件，比如routers.js里：

module.exports = function(app) {

   // 此处可加入各种后端api接口

  app.get('/api/getName', function(req, res, next) {

    delete require.cache[require.resolve('./allNames')]

    res.send(require('./allNames'))

  })

}

然后在dev-server.js里引入routers.js即可：

var routers = require('/path/to/routers.js')

routers(app)

nodejs里require引入模块时采取的是缓存机制，更改数据源allNames后，在不清除缓存的条件下，只能重启node才能更新数据，为避免此种情况，可先将缓存删除掉，即delete require.cache[require.resolve('./allNames')]，这样每次更改allNames后，前端去向“/api/getName”获取数据时都可以得到即时更改。