uniapp 简易通用的ajax 请求 封装 以及携带token去请求

1、例如：在api文件夹中新建一个api.js

//  公共的方法

const baseUrl = "http://192.xxx.xx.xx:8889";  // 请求地址
const $ajax = {
		get: function({
			url,
			param,
			header
		}) {
			return new Promise(function(resolve, reject) {
				uni.request({
					url: baseUrl + url,
					data: param,
					method: "GET",
					success: function(res) {
						if (res.statusCode !== 200) {
							reject(res);
						} else {
							resolve(res);
						}
					},
					fail: function(err) {
						reject(err);
					}
				})
			})
		},
		post: function({
			url,
			data,
			header
		}) {
			return new Promise(function(resolve, reject) {
				uni.request({
					url: baseUrl + url,
					data: data,
					method: "POST",
					header: {
						'Content-Type': 'application/x-www-form-urlencoded'
					},
					success: function(res) {
						if (res.statusCode !== 200) {
							reject(res)
						} else {
							resolve(res);
						}
					},
					fail: function(err) {
						reject(err)
					}
				})
			})
		},
		postJSON: function({
			url,
			data,
			header
		}) {
			return new Promise(function(resolve, reject) {
				uni.request({
					url: baseUrl + url,
					data: data,
					method: "POST",
					header: {
						'Content-Type': 'application/json;charset=UTF-8'
					},
					success: function(res) {
						if (res.statusCode !== 200) {
							reject(res)
						} else {
							resolve(res);
						}
					},
					fail: function(err) {
						reject(err)
					}
				})
			})
		},
		upImg: function({
			url,
			imgUrl
		}) {
			return new Promise(function(resolve, reject) {
				uni.uploadFile({
					url: "baseUrl" + url,
					filePath: imgUrl,
					name: 'file',
					success: function(uploadFileRes) {
						resolve(uploadFileRes);
					},

					fail: function(err) {
						reject(err)
					}
				});
			})
		}
	}
export default $ajax;

2、引入

例如：在main.js中全局引入

//  在main.js中引入

import ajax from './api/api.js'

3、使用

// get请求

this.$ajax.get({
	url: `/wx/wxLogin`,
	param: {
		password: this.pwd,
		username: this.name,
		uuid: this.uuid
	}
}).then((res) => {
		console.log(res.data)			

})

4、携带token

有的接口在发送http请求的时候需要验证token，登陆成功后我们需要把Authorization字段的值放到header里面，携带token去发送请求。

①在api文件夹中新建config.js文件，封装一下方法

const app = {
	    apiUrl: 'http://192.xxx.xx.xxx:8889', //请求的地址
		baseRequest(obj) {
			try {
				const userToken = uni.getStorageSync('userToken');
				if (userToken) {
					if (obj.header) {
						obj.header["Authorization"] = userToken;
					} else {
						obj.header = {
							"Authorization": userToken
						};
					}
					obj.url = this.apiUrl + obj.url;
					uni.request(obj)
				} else {
					console.log("获取不到userToken")

				}
			} catch (e) {
				console.log(e)
				console.log("获取不到userToken")
			}
		},
	}
export default app

②登陆成功后设置缓存

// 设置缓存

uni.setStorageSync('userToken', res.data.token),

③其他地方调用

// 顺便介绍一下获取缓存

getToken() {
	uni.getStorage({
		key: 'userToken',
		success: (res) => {
		// console.log('这是获取key中的内容',res) 
		this.tokenData = res.data;
		console.log('这是获取token', this.tokenData)
		if (this.tokenData) {
		   
		}

	}
 })
},

// 注意要引入config.js    

import app from "@../../api/config.js"

// 在methods中调用封装好的方法

getMaintenance() {
	app.baseRequest({
	url: `/repairType/xxx/xxx`,
	method: 'get',
	success: (res) => {
		
  }
 })
},