uni.request()相关问题

一、uni-app前端post请求数据json序列化

1. 前置须知

Content-Type 实体头部用于指示资源的 MIME（媒体）类型 media type 。

在请求中，客户端告诉服务器实际发送的数据类型。
在响应中，Content-Type 标头告诉客户端实际返回的内容的内容类型。

2. uni.request({})

2.0 基本封装

const baseUrl = 'http://localhost:8003'

export function request(url, params, method, header, complete) {
	return new Promise((resolve, reject) => {
		uni.request({
			url: `${baseURL}${url}`, 
			data: params,
			dataType: 'json', 
			method: method, 
			header: header,
			success: (res) => {
				if (res.statusCode === 200) {
					// 可在分业务逻辑 res.data.code
					resolve(res.data); // { code:1,data:{},msg:'成功' }
				} else {
					if (res.errMsg) {
						uni.showToast({
							title: res.errMsg,
							icon: 'none'
						});
					}
					reject(res)
					console.err(res)
				}
			},
			fail: (err) => {
				uni.showToast({
					title: '网络不稳定请重试！',
					icon: 'none'
				});
				reject(err)
				console.err(err)
			},
			complete: () => {
				complete();
			}
		});
	})
}

// 接口
export function getList (data,complete) {
    return request(`/api/xxx/xxx/${data.pageNumber}/${data.pageSize}`,data,'POST', {'content-type': 'application/json'}, complete)
}

// 调用
const params = {}
getList(params,()=>{}).then(
    res=> {
        this.xxxList = res.data
    }
)

2.1 data请求参数说明

对于 GET 方法，会将数据转换为 query string。例如 { name: 'name', age: 18 } 转换后的结果是 name=name&age=18。
对于 POST 方法且 header['content-type'] 为 application/x-www-form-urlencoded 的数据，会将数据转换为 query string。
对于 POST 方法且 header['content-type'] 为 application/json 的数据，会进行 JSON 序列化，默认。

这也就是为什么，前端设置请求体类型为json、后台@RequestBody JSONObject json接收参数，发送请求时参数是 Object 却不需要手动通过JSON.stringify(data)序列化，请求不会报错；dataType: 'json', //服务器返回json格式数据，如果设为 json（默认），会对返回的数据进行一次 JSON.parse，非 json 不会进行 JSON.parse。

2.2 success返回参数说明

“成功接收数据”进入success回调，res参数接收，res对象的结构：

参数	类型	说明
data	Object/String/ArrayBuffer	开发者服务器返回的数据
statusCode	Number	开发者服务器返回的 HTTP 状态码
header	Object	开发者服务器返回的 HTTP Response Header
cookies	Array`.<string>`	开发者服务器返回的 cookies，格式为字符串数组