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

最新推荐文章于 2025-10-13 11:13:40 发布

原创

最新推荐文章于 2025-10-13 11:13:40 发布 · 2.1k 阅读

3 ·

CC 4.0 BY-SA版权

文章标签：

#vue #js

在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的地方做相应修改，并确保重启程序以使更改生效。

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

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

解决办法：

在vue.config.js中修改为

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