vue-cli项目中,解决跨域问题。
在config > index.js 文件中的proxyTable里边添加’/api’配置
proxyTable: {
'/api': {
// 跨域域名
target: 'http://www.xxxxx.cn',
// 是否跨域
changeOrigin: true,
pathRewrite: {
'^/api': ''
}
}
},
在vue组件中使用
methods: {
// 加载数据
getUserInfo () {
this.$axios.get('api/mall/servlet/json?funcNo=3040')
// this.$axios.get('http://www.xxxxx.cn/mall/servlet/json?funcNo=3040')
.then(this.handleGetUserInfoSucc)
.catch(error => console.log(error))
}
}
需要重新运行项目,不然会报错
重新运行项目后本地开发就不会出现跨域问题了。
当项目打包,放到服务器上,会报错
Failed to load resource: the server responded with a status of 404 (Not Found)
开发的时候用的dev_server只针对开发用的,打包后dev_server这块配置的请求代理已经无效。
这时直接将域名放到get中,打包放到服务器
methods: {
// 加载数据
getUserInfo () {
// this.$axios.get('api/mall/servlet/json?funcNo=3040')
this.$axios.get('http://www.xxxxx.cn/mall/servlet/json?funcNo=3040')
.then(this.handleGetUserInfoSucc)
.catch(error => console.log(error))
}
}