uniapp请求接口封装

最近做了一个uniapp的项目(引入了uView样式),前端请求接口封装:

在App.vue同级目录创建utils文件夹,文件夹内新建request.js

代码如下:

//请求接口地址
// const baseUrl = 'http://xxx.xxx.x.xxx:8080/api'
//self
// const baseUrl = 'http://xxx.xxx.x.xxx:8080/api'
//product
const baseUrl = 'http://xxx.xxx.x.xxx:8080/api'
// const uri = 'http://xxx.xxx.x.xxx:8080';

/**
 * 普通请求数据
 */
const httpRequest = (url, method, data = {}, needToken = false) => {
	let header =  {
		'content-type': 'application/x-www-form-urlencoded'
	};
	if(needToken){
		let token = uni.getStorageSync('token');
		if(token){
			header['token'] = token;
		}else{
			uni.reLaunch({
				url:"/pages/login/login"
			})
		}
	}
    let httpDefaultOpts = {
        url: baseUrl + url,
        data: data,
        method: method.toUpperCase(),
		header: header,
        dataType: 'json',
    }
    return new Promise(function(resolve, reject) {
		// uni.showLoading({
		// 	title:'数据加载中,请稍后...',
		// 	mask:true
		// });
		// console.log('inputParam ' + JSON.stringify(data));
        uni.request(httpDefaultOpts).then(
            (res) => {
				// uni.hideLoading();
				if(res.length > 1 && res[1].statusCode == 200){//成功返回
					if (res[1].data.code == 2){
						uni.reLaunch({
							url:"/pages/login/login"
						})
						setTimeout(()=>{
							uni.showToast({
								title:'当前用户已在其他设备登陆,请重新登陆!',
								icon:'none'
							})
						},100)
						return;
					}
					resolve(res[1])
				} else {
					uni.showToast({
						title:'服务器异常,请联系管理员!',
						icon:'none'
					})
					//resolve(res[1]) //错误信息返不返回 看个人情况
				}
            }
        ).catch(
            (response) => {
                reject(response);
				uni.showToast({
					title:'网络异常,请稍后重试!',
					icon:'none'
				})
            }
        )
    })
};

/**
 * 上传图片
 

你可能感兴趣的:(vue)