‘Access to XMLHttpRequest at ... from origin ... has ben blocked by CORS policy‘vue中的跨域问题解决办法

土豆流氓兔

于 2020-10-05 22:37:49 发布

阅读量2k

点赞数 1

CC 4.0 BY-SA版权

分类专栏：软件开发文章标签： vue js

本文链接：https://blog.youkuaiyun.com/Aphea/article/details/108933931

在Vue项目中，使用axios进行HTTP通信时遇到'Access to XMLHttpRequest at ... from origin ... has been blocked by CORS policy'错误。经测试，GET请求HTTPS协议URL成功，而HTTP协议则失败，确认为跨域问题。解决方案包括在vue.config.js中配置，axios.js中设置，以及使用axios的地方做相应修改，并确保重启程序以使更改生效。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

用vue做的前端，当通过axios通信时，直接报错，且无返回码

目的url是http协议，通过测试发现，get其他https协议的url能够成功，初步判断是协议的问题，即跨域

解决办法：

在vue.config.js中修改为

module.exports = {
   
   
    devServer: {
   
   
        proxy: {
   
   
            '/api': {
   
   
                // 此处的写法，目的是为了 将 /api 替换成 https://www.baidu.com/
                target: 'http://21m1649