TA的每日心情 | 开心 2021-12-13 21:45 |
---|
签到天数: 15 天 [LV.4]偶尔看看III
|
vue本地测试和打包上线,接口不同域名,测试需要跨域和正式不需要跨域的解决方法
通过判断本地环境还是打包环境
定义全局变量,在global.vue中定义:
<script type="text/ecmascript-6">
const BASE_URL = ""
export default{
BASE_URL
}
</script>
在main.js 中引入:如
import global_ from "@/components/global.vue"
挂载到vue 实例中:
Vue.prototype.GLOBAL = global_
//打包环境判断
if(process.env.NODE_ENV == "production"){
Vue.prototype.GLOBAL.BASE_URL=" 部署服务调用正式地址"
}else{
//不用跨域
Vue.prototype.GLOBAL.BASE_URL="开发测试地址"
//跨域,proxyTable代理,自定义如/api
Vue.prototype.GLOBAL.BASE_URL="/api"
}
在config index.js 配置如下:
proxyTable: {
"/api": {
target: "http://xxxxx.cn",//设置你调用的接口域名和端口号 别忘了加http
changeOrigin: true,
pathRewrite: {
"^/api": "/" // 这里理解成用‘/api’代替target里面的地址,后面组件中我们掉接口时直接用api代替 比如我要调用"http://40.00.100.100:3002/user/add",直接写‘/api/user/add’即可
}
}
},
接下来你的接口地址可以这样写啦:
axios.post(this.GLOBAL.BASE_URL+"/huananhospital/findGoodByTypeId").then((res)=>{
})
|
|