vue打包之后动态修改请求接口方法

Posted lizhao123

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了vue打包之后动态修改请求接口方法相关的知识,希望对你有一定的参考价值。

1.可以根据自身情况封装获取配置文件接口信息

1.1我在static中新建一个config.json配置文件

{
	"DEV_URL":"/apis",//开发模式
	"BUILD_URL": "/apis"//打包之后接口
}

2.我在每次请求之前都会获取配置文件,你也可以只获取一次做下判断即可  

//获取配置文件
async function startApp() {
	let API_URL
	if(process.env.NODE_ENV==‘development‘){
		let data=await Vue.http.get(‘/static/config.json‘)
		API_URL=JSON.parse(data.bodyText).DEV_URL
	}else{
		let data=await Vue.http.get(‘./static/config.json‘)
		API_URL=JSON.parse(data.bodyText).BUILD_URL
	}
	return API_URL
}

3.我封装的请求接口

async function doGet(url, req, successCallback, errorCallback) {
	let service_url=await startApp() 
	req=filterUndefined(req)
	// 每次切换页面时,调用进度条
	NProgress.start();
	Vue.http.get(service_url + url,{params:req}, {
		emulateJSON: true, //允许跨越
	}).then(function(response) {
		// 在即将进入新的页面组件前,关闭掉进度条
		NProgress.done()
		// 响应成功回调
		successCallback && successCallback(response.data);
	}, function(error) {
		// 在即将进入新的页面组件前,关闭掉进度条
		NProgress.done()
		// 响应错误回调
		errorCallback && errorCallback(error)
	});
}

  

以上是关于vue打包之后动态修改请求接口方法的主要内容,如果未能解决你的问题,请参考以下文章

vue webpack打包之后 重新修改配置文件接口API路径,无需修改代码后再打包

vue打包之后生成一个配置文件修改请求接口

webpack+vue打包之后输出配置文件修改接口文件

vue打包之后生成一个配置文件修改接口

vue打包后生成可配置文件,用于修改接口路径等

vue打包之后配置统一请求地址