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

总结

以上是生活随笔为你收集整理的VUE跨域问题的全部内容，希望文章能够帮你解决所遇到的问题。

如果觉得生活随笔网站内容还不错，欢迎将生活随笔推荐给好友。