vue如何配置跨域请求

最新推荐文章于 2025-03-25 15:20:33 发布

shark skr

最新推荐文章于 2025-03-25 15:20:33 发布

阅读量845

点赞数

文章标签： vue.js javascript webpack ajax跨域问题

本文链接：https://blog.youkuaiyun.com/m0_62351434/article/details/122248809

版权

本文介绍了在Vue脚手架项目中如何解决跨域问题。通过创建vue.config.js文件并添加特定配置，可以解决axios请求时遇到的跨域障碍。同时提到了axios的全局和局部引入方式。

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

vue脚手架怎么解决跨域问题

跨域问题报错
在这里插入图片描述

解决方案

首先在项目根目录下创建vue.config,js文件，文件名是固定的，不一样会报错。
然后在vue.config,js文件中复制下面的代码即可。

module.exports = {//可以修改webpack默认配置
    devServer: {
        open:true,//是否自动弹出浏览器
        port:8080,//修改默认端口
        proxy: {//代理转发
            '/api': {
                target:'http://m.sirfang.com/api',
                // ws:false,//是否开启websockes协议请求--即时通讯请求
                changeOrigin:true,//本地是否开启代理
                pathRewrite : {
                    '^/api':''
                }
            }
        }
    }
}