开发模式
要知道,跨域这个行为是浏览器禁止的,但是服务端并不禁止。使用proxyTable的原理就是将域名发送给本地的服务器,再由本地的服务器去请求真正的服务器。
打开config/index.js,修改dev里的proxyTable
proxyTable:{
'/': {
target: 'http://www.xxx.cn/api', //你要访问的服务器域名
changeOrigin: true, //允许跨域
pathRewrite: {
'^/': ''
}
}
}
当你在别的页面请求时只要是/,你只需要/xx/xxx 它就会帮你处理成 http://www.xxx.cn/xx/xxx。
假如项目需要请求两个不同的域名,proxytable在上面的基础上再增加,当请求时/json/xx/xxx开头的最后都会转换成http://www.aaa.cn/xx/xxx
'/json': {
target: 'http://www.aaa.cn/', //你要访问的服务器域名
changeOrigin: true, //允许跨域
pathRewrite: {
'^/json': ''
}
}
但实际上接口是没有json的,这只是你用来区分请求的一个别名,这时pathRewrite就可以将/json去掉
生产环境
找到config/pro.env.js
module.exports = {
NODE_ENV: '"production"',
API_ROOT: '"http://www.xxx.cn/"'
}
在config目录下新建api.js文件
const root = process.env.API_ROOT; //在开发模式下为会调用代理
export const getList = root + '/list'
这样配置后你可以直接在组件写请求的url不需再判断处于哪个模式下,都可以跨域请求。
**粗体** _斜体_ [链接](http://example.com) `代码` - 列表 > 引用
。你还可以使用@
来通知其他用户。