用uniapp封装uni.request请求_uniapp header

---

前言

提示：记录下工作中uniapp用到的请求：

如果不封装请求的话，每次发起请求的时候都要写很多重复的代码，所以我们可以把一些重复的代码进行封装。

---

提示：以下是本篇文章正文内容，下面案例可供参考

一、uniapp封装request请求

1.封装请求头

代码如下（示例）：

//设置请求头
	config.header = {
		'content-type': 'application/json',
	};
	//检查缓存中有没有token
	var token = wx.getStorageSync('token');
	if (token != '') {
		header = {
			'content-type': 'application/json',
			'Authorization': 'Bearer ' + token
		};
	}
1
2
3
4
5
6
7
8
9
10
11
12

2.用promise包装一层uni.request请求

let promise = new Promise(function(resolve, reject) {
		uni.request({
			header:header,
			url:baseUrl+url,
			method:method,
			success: (res) => {
				resolve(res)
				console.log(res)
			},
			fail: (res) => {
				reject(res)
				console.log(res)
			}
		})
	})
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15

3.完整的代码

const baseUrl = "XXXXXXXXXXX";
export function https(url,method) {
	//设置请求头
	var header = {
		'content-type': 'application/json',
	};
	//检查缓存中有没有token
	var token = wx.getStorageSync('token');
	if (token != '') {
		header = {
			'content-type': 'application/json',
			'Authorization': 'Bearer ' + token
		};
	}
	let promise = new Promise(function(resolve, reject) {
		uni.request({
			header:header,
			url:baseUrl+url,//请求地址
			method:method,//请求方式
			success: (res) => {
				resolve(res)
				console.log(res)
			},
			fail: (res) => {
				reject(res)
				console.log(res)
			}
		})
	})
	return promise
}

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32

二、用封装的请求获取数据

1.引入库

代码如下（示例）：

//根据自己包的位置
	import {https} from '../../common/HttpUtil.js'
1
2

2.读入数据

代码如下（示例）：

https('/xxx/xx/xxx/xxx','get').then(res=>{
            		//res即为获取到的数据
					console.log(res)
				})
1
2
3
4

---

总结

记录一下，增加记忆。