分享Vue前端跨域的问题


开发环境中跨域的问题,可以使用使用Webpack配置来进行解决。

在用Node写完后端接口之后,我开始使用Axios来进行交互。

发现后端接口报错,一番百度之后,发现了一个问题,我的开发环境是8080端口,node监听的却是3000端口,这里涉及到跨域的问题,我开始慢慢的去了解跨域,在网上很多的资料,最终把这个问题解决了,把代码贴出来。

在webpack配置如下:

找到目录下的config文件夹. 找到index.js文件. 在dev{}里添加这几行代码. ```proxyTable: { '/api': { target: 'http://127.0.0.1:3000/api', changeOrigin: true, pathRewrite: { '^/api': '' // 若target中没有/api、这里又为空,则404; } } }


在我们的proxyTable里添加你的后端接口地址,并且允许跨域,我这里的接口前缀是使用的/api。 

(更新vue-cli3.0配置)

在vue-cli3.0config已经没有了,需要我们自行在根目录添加vue.config.js配置代码还是一样的.

声明:Web前端小站 - 前端博客|版权所有,违者必究|如未注明,均为原创|本网站采用BY-NC-SA协议进行授权

转载:转载请注明原文链接 - 分享Vue前端跨域的问题


行路有良友,便是捷径。带上我吧,一起去看更大的世界。