情景

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': '' //路径转发代理
                }
            }
        }
    }
}

在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
成功。

Logo

前往低代码交流专区

更多推荐