在做一个vue+node的个人博客时，突然想如果前台在开发环境下可以和服务端连起来测试就好了。但是由于端口不同，所以得跨域请求了，但是前台开发完后，是不是全部URL都要改？
于是搜索了一下，发现了“proxyTable”。
修改config/文件夹下的index.js
dev: {
proxyTable: {
// proxy all requests starting with /api to jsonplaceholder
'/api': {//虚拟目录
target: 'http://127.0.0.1:3000',//地址
changeOrigin: true,
pathRewrite: {
'^/api': ''//由于上面的虚拟目录实际上是不存在的，不去掉的话访问的时候显示的url会变成'http://127.0.0.1:3000/api'，所以得去掉
}
}
},
配置了上面的参数后，在调用时就要（这里用的是axios,例如地址是http://127.0.0.1:3000/aaa）
axios.post('/api/aaa', {})
.then(function (response) {
console.log(response);
})
.catch(function (error) {
console.log(error);
});
为什么要有个‘/api’？因为步骤1那里写的是‘/api’,那怎么办?别忘了，因为用的是axios，所以可以配置一下baseURL ，我这里就全局配置baseURL
axios.defaults.baseURL = '/api'
这样就可以通过代理访问服务端了
如果不想通过代理而是直接访问服务端，那就在服务端配置允许所有域访问
配置服务端
服务端我用的是express框，不借助其它包可以这样配置
app.all('*', function (req, res, next) {
res.header('Access-Control-Allow-Origin', '*');
res.header('Access-Control-Allow-Headers', 'Content-Type, Content-Length, Authorization, Accept, X-Requested-With , yourHeaderFeild');
res.header('Access-Control-Allow-Methods', 'PUT, POST, GET, DELETE, OPTIONS');
if (req.method == 'OPTIONS') {
res.send(200);
/*让options请求快速返回*/
} else {
next();
}
});
然后用cors，可以这样配置
//独自设置
var cors = require('cors');
app.post('/aaa',cors(), ...);
//全局设置
var cors = require('cors')
var app = express()
app.use(cors())
更多用法请参考cors
大功告成啦！可以愉快地继续写代码啦
