nuxt2如何实现配置多个代理proxy请求完整代码

前端在如今的开发环境中已然成为重要的一环,那么在前端开发中众多框架中对于数据的请求都是必不可少的存在。

本篇文章就来介绍在nuxt框架中如何实现并配置多个代理proxy进行请求数据。

nuxt.config.js中配置如下:

axios: {
// 开启代理 (如果需要判断线上线下环境,可以通过 process.env.NODE_ENV !== 'production' 来判断)
proxy: true,
// 跨域请求时是否需要使用凭证
credentials: true
},
proxy: {
'/api': {
// 目标接口域
target: '',
// 全局配置是否跨域
changeOrigin: true,
pathRewrite: {
'^/api': '/'
}
},
'/spis': {
// 目标接口域
target: '',
// 全局配置是否跨域
changeOrigin: true,
pathRewrite: {
'^/spis': ''
}
}
},

多个代理请求数据在页面中的使用

this.$axios.get("/spis/请求地址").then(res=>{
console.log(res)
})
this.$axios.get("/api/请求地址").then(res=>{
console.log(res)
})

多个代理proxy使用可以极大程度满足那些一个站点需要多个域名请求的需求,使开发变得更为实用、便捷。

六月初字帖坊小程序 你想要的字帖模板及工具,这里都有!