【Vue】前端跨域解决方法

情景

Vue项目的url：http://localhost:8080/
本地后台所在: http://localhost:8081/
这样就导致了跨域问题，解决方法林林总总，特开一遍文章来持续记录。

前端跨域

vue.config.js

找到项目的根目录下的 vue.config.js 文件（没有就新建），然后在里面输入以下代码：

//在根目录下创建vue.config.js,如下配置：
module.exports = {
    devServer: {
        //跨域
        proxy: {
            '/api': {
                target: 'http://localhost:8081/dong-guan-project/tp6-dgjx/public/index.php', //路径指向本地主机地址及端口号
                changOrigin: true,//准许跨域
                //路径重写
                pathRewrite: {
//重写路径，当我们在浏览器中看到请求的地址为：
//http://localhost:8080/api/frontend/experts/getlist 时
//实际上访问的地址是：
//http://localhost:8081/dong-guan-project/tp6-dgjx/public/index.php/frontend/experts/getlist
//因为重写了 /api
                    '^/api': '' //路径转发代理
                }
            }
        }
    }
}

成功。