@vue/cli 4.4.6解决跨域问题

2022-08-01,,,

在前端@vue/cli 4.4.6解决跨域问题,可以通过vue.config.js配置完成

例如:需要访问https://jsonplaceholder.typicode.com/posts/,但是提示跨域,此时做以下配置:

module.exports = {
    devServer: {
        host: 'localhost',
        port: 8081,
        proxy: {  //配置跨域
            '/el': {
                target: 'https://jsonplaceholder.typicode.com/',  //这里后台的地址模拟的;应该填写你们真实的后台接口
                changOrigin: true,  //允许跨域
                pathRewrite: {
                    '^/el': ''
                }
            },
        }
    },
};

即:el表示https://jsonplaceholder.typicode.com/
此时前端只需将地址改为/el/posts/

在浏览器的network中发现访问的地址为http://localhost:80801/el/posts/,实质访问的就是目标地址。

本文地址:https://blog.csdn.net/shylot/article/details/107532481

《@vue/cli 4.4.6解决跨域问题.doc》

下载本文的Word格式文档,以方便收藏与打印。