VUE3.x利用反向代理解决跨域
在这里插入代码片`大家都知道vue3.x相比于vue2.x更加的轻量级,也就意味着有些文件已经不会有了,那么在vue 3.x中如何设置反向代理?首先在根目录创建一个新的js文件(vue.config.js)然后再其文件里面设置module.exports = {devServer: {proxy: {'/api': {//请求称号...
·
在这里插入代码片`大家都知道vue3.x相比于vue2.x更加的轻量级,也就意味着有些文件已经不会有了,
那么在vue 3.x中如何设置反向代理?
首先在根目录创建一个新的js文件(vue.config.js)
然后再其文件里面设置
module.exports = {
devServer: {
proxy: {
'/api': {//请求称号
target: 'http://127.0.0.1:3000', //请求的接口
changeOrigin: true,//允许跨域
pathRewrite: {
'^/api': '/'
}
}
}
}
}
设置之后,如果用的是axios的话 将/api 当做域名就可以了 比如
(async function(self){
var res = await self.$http.get(
"api/books/nowbooks"
)
self.resq = res.data
})(this)
这个就相当于
(async function(self){
var res = await self.$http.get(
"http://127.0.0.1:3000/books/nowbooks"
)
self.resq = res.data
})(this)
这样就可以了
更多推荐
已为社区贡献4条内容
所有评论(0)