乐趣区

VUE跨域问题

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))
}
}

退出移动版