uniapp 请求封装 uni.request 封装

1. request .js 注意代码中的引用路径

import store from '../../store/index.js'
/**
 * method:请求方式
 * url:请求的url
 * data:请求参数
 * message: 加载文案
 */
const noLodingurl = ['padge/index/index']
let httpList = {}

function reSend(method, url, data, message,apiUrl,resolove,reject,times){
	message&&uni.showLoading({title:message||'', mask:true})
	getApp().globalData.httpList = httpList
	httpList[url] = uni.request({
		url: apiUrl + url,
		header: {
			Authorization: uni.getStorageSync('token')? 'bearer ' + uni.getStorageSync('token'):'',
			version: '1.0.5',
			// #ifdef MP-WEIXIN
				product:'Wxmp'//请求方标记，Android/IOS/Wxmp微信小程序
			// #endif
			// #ifdef MP-ALIPAY
				product:'ZFB_MINI'//请求方标记，Android/IOS/Wxmp微信小程序
			// #endif

		},
		method,
		data,
		success(res) {
			if(message) uni.hideLoading()
			if (res.statusCode == 200||res.statusCode == 429) {
				if(res.data.code === 101 || res.data.code === 10006){
	                // 调用登出方法
					store.dispatch('LoginOut').then(() => {
						setTimeout(res => {
						    // 跳转到登陆页面 
							uni.navigateTo({
								url: '/pages/wxLogin/wxLogin'
							})
						},200)
					})

				}else{
					if(!noLodingurl.includes(url)&&(res.data.msg.includes('火爆')||res.data.msg.includes('频繁'))&&times<12){
						//如果返回限流结果，重新发起该请求，直到返回结果
						times++
						setTimeout(()=>{
							reSend(method, url, data, message,apiUrl,resolove,reject,times)
						},5000)
					}else{
						resolove(res.data)
					}

				}
			}else if(res.statusCode == 401){
				if(res.data.code === 99998){
					resolove(res.data)
				}else{
				  // 登出
					store.dispatch('LoginOut').then(() => {
						setTimeout(res => {
						// 跳转到登陆页面 
							uni.navigateTo({
								url: '/pages/wxLogin/wxLogin'
							})
						},200)
					})
				}
			}else{
				times++
				if(times<12){
					setTimeout(()=>{
						reSend(method, url, data, message,apiUrl,resolove,reject,times)
					},5000)
				}else{
					reject(res)
				}

			}
		},
		fail(res) {
			if(res.errMsg.indexOf('abort') == -1){
				uni.showToast({
					title: '网络走丢了，请刷新重试',
					icon: "none"
				})
			}
			reject(res)
			uni.hideLoading()
		}
	})
}
function getRequest(method, url, data, message) {
	let apiUrl = getApp().globalData.requestUrl;
	return new Promise((resolove, reject) => {
		reSend(method, url, data, message,apiUrl,resolove,reject,0)
	})
}
// 有参数有加载
function dataRequestYesLoading(method, url, data, message) {
  return this.getRequest(method, url, data, message)
}
// 有参数无加载
function dataRequestNoLoading(method, url, data) {
	return this.getRequest(method, url, data, '')
}
// 无参数有加载
function getRequestYesLoading(method, url, message) {
  return this.getRequest(method, url, '', message)
}
// 无参数无加载
function getRequestNoLoading(method, url) {
  return this.getRequest(method, url, '', '')
}
// 向外暴露
module.exports = {
	getRequest,
  dataRequestYesLoading,
  dataRequestNoLoading,
  getRequestYesLoading,
  getRequestNoLoading,
}

2. App.vue

<script>
export default {
	globalData: {
	// 正式
		// requestUrl: 'https://xxxx.xxxxx.com/',
	// 测试
		requestUrl: 'https://xxxxx.xxxxx.com/api/',
    // 开发
		// requestUrl: 'https://xxxxxxxx.goho.co/',
	},
 }
 </script>

3. main.js

import store from './store'
// 注意此处的引用路径
import uniApi from './common/js/request.js'  // 请求request

Vue.prototype.$uniApi = uniApi

4. store/index.js

//引入vue和vuex
import Vue from 'vue'
import Vuex from 'vuex'
import user from './modules/user.js'  // 用户
Vue.use(Vuex)

const store = new Vuex.Store({
	modules:{
		user,
	},
	actions: {
		//  退出登录
		LoginOut({commit}) {
			return new Promise((resolve, reject) => {
		        // 清除token 和用户信息
				commit('SET_TOKEN', null)
				commit('SET_USERINFOR', null)
				uni.removeStorageSync('token')
				uni.removeStorageSync('userInfor')
				resolve()
			})
		}
	}
})

export default store

5. store/modules/user.js

import uniAPI from '@/api/request.js'
const user = {
	state: {
		token: uni.getStorageSync("token"),
		userInfor: uni.getStorageSync("userInfor"),
	},
	getters: {
		token: state => state.token,
		userInfor: state => state.userInfor
	},
	mutations: {
		SET_TOKEN: (state, token) => {
			state.token = token
		},
		SET_USERINFOR: (state, userInfor) => {
			state.userInfor = userInfor
		}
	}
}
export default user

6. 代码中使用

// post
this.$uniApi.dataRequestNoLoading('POST','product/app/v1/expertHotProduct/selectRentCarPage',param).then(res => {
		
		if(res.code === 1){
			console.log(res,'数据数据数据数据数据数据数据')
		}
	}).catch(err => {
		
	})
// get
  	this.$uniApi.getRequestNoLoading('GET', 'manager/app/v1/driver/detail/').then(res => {
	if (res.code === 1) {
		this.driverInfo = res.data
			this.loadingStatus = false
		}
	})

7. 复制更换登录页路径 可直接用！