vue3 跨域请求_vue3跨域请求

首先 在根目录下(就是与package.json文件同目录的地方) 创建 vue.config.js 文件，有就不用创建，然后如下：

module.exports = {
    devServer: {
        open: true,
        host: 'localhost',
        port: 8080,
        https: false,
        //以上的ip和端口是我们本机的;下面为需要跨域的
        proxy: {//配置跨域
            // 这个地方的 '/api'  名字要和底下 '^/api'  这个地方的名字一样。如果这里是 '/bpi'，那么底下就也要是 '^/bpi'
            '/api': {
                target: 'https://cms-api.csdn.net/',//这里后台的地址模拟的;应该填写你们真实的后台接口
                ws: true,
                changOrigin: true,//允许跨域
                pathRewrite: {
                    '^/api': ''//请求的时候使用这个api就可以
                    // 如：你需要访问：https://cms-api.csdn.net/v1/web_home/select_content?componentIds=www-recomend-community
                    // 现在只需这样子输入url： /api/v1/web_home/select_content?componentIds=www-recomend-community  即可
                    // 它会变成：http://localhost:8080/api/v1/web_home/select_content?componentIds=www-recomend-community  并允许跨域
                }
            }

        }
    }
}
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24

详见：https://blog.csdn.net/weixin_42551369/article/details/108579964 (感谢大佬)