vue解决跨域

最新推荐文章于 2024-07-24 13:30:37 发布

侯先生

最新推荐文章于 2024-07-24 13:30:37 发布

阅读量129

点赞数

分类专栏：笔记文章标签： vue.js

本文链接：https://blog.csdn.net/qq_45787678/article/details/116138165

版权

笔记专栏收录该内容

11 篇文章 0 订阅

订阅专栏

代理服务器解决跨域

在根目录添加vue.config.js 文件，并添加以下代码

module.exports = {
    // 开发环境下的服务器配置
    devServer:{
        // open:true,//自动打开浏览器
        proxy:{  //代理服务器的配置
            // 以/api开头的请求，进行以下代理服务器发送配置
            "/api":{
                target:"http://bd.com/",//此处为需要跨域的域名
                changeOrigin:true, // 支持跨域
                pathRewrite:{
                    "^/api":""
                }
            }
        }
    }
}

或者

在baseurl中配置路径

var baseURL=require("./src/tools/baseURL")

module.exports={
    publicPath:"/", 
    outputDir:"dist",
    indexPath:"index.html",
    pages:{
        index:{
            entry:'src/main.js',
            // 来源模板
            template:"public/index.html",
            fileName:"dist/index.html",
            title:"shopping"
        }
    },
    devServer:{
        compress:true,  //是否启用压缩代码
        port:9000,    //8080改成了9000
        host:"0.0.0.0",  //打包之后改成服务器地址
        hot:true,
        open:true,   //自动打开浏览器
        proxy:{     //代理服务器
            "/myApi":{
                target:baseURL+"/api",     //接口地址
                changeOrigin:true,
                pathRewrite:{   //重写
                    "^/myApi":""
                }
            }
        }
    }
}