1.前言
小程序的开发中涉及到数据的请求，此时我们就需要用到微信小程序提供的API wx.request。本文主要讲解如何使用该API进行数据请求，涉及到请求API，发送请求，接收请求等操作。
2.API介绍
2.1 wx.request
wx.request是小程序提供的一个API，用来发起网络请求，可根据请求结果进行相应的数据处理。
其基本参数如下：
wx.request({
url: '',
data: {},
header: {},
method: '',
dataType: '',
responseType: '',
success: function(res) {},
fail: function(res) {},
complete: function(res) {},
})
其中：
- url: 请求地址，即我们需要请求的数据的url。
- data: 需要发送的数据。
- header: 请求的header，可设置token等信息。
- method: 请求方式，默认为GET
- dataType: 返回数据的类型，默认为json。
- responseType: 响应数据的类型，默认为text。
- success: 请求成功的回调函数。
- fail: 请求失败的回调函数。
- complete: 请求完成的回调函数。
2.2 参数详解
- url：在小程序中请求的URL必须是HTTPS的，且返回的数据必须是JSON格式的。
- data：如果请求方式为GET，那么data会被拼接到url后，如：http://example.com/?name=zhangsan&age=20。如果请求方式为POST，则data会在发送请求时以请求体的方式发送，如：name=zhangsan&age=20。
- method：请求方式，默认为GET。合法值为：OPTIONS、GET、HEAD、POST、PUT、DELETE、TRACE、CONNECT。
- header：请求的header信息，可以设置token等信息
- dataType：请求的数据类型，默认为json。可选值为：json、其他格式。
- success：请求成功的回调函数。调用成功时会将服务器返回的数据传入函数体内。
- fail：请求失败的回调函数。
- complete：请求完成的回调函数，无论请求成功或失败，都会被调用。
3.实践操作
3.1 发送请求
发送请求前，需要判断网络状态，可以使用wx.getNetworkType和wx.onNetworkStateChange等API进行判断，这里不做详细介绍。
下面以发送GET请求为例，介绍如何使用wx.request发送请求：
// 在需要发送请求的页面中引入wx.request接口
import { request } from '../../src/utils/request.js'
Page({
data: {
result: ''
},
onLoad: function () {
let _this = this
// 发送GET请求
request({
url: 'http://example.com/api/getData',
method: 'GET',
success: function (res) {
// 获取到数据后，将结果保存到result中
_this.setData({
result: res.data
})
}
})
}
})
在代码中，我们首先引入request接口，接着在onLoad事件中，向http://example.com/api/getData发送了一个GET请求，并将返回结果存储在result中，用于页面展示。
3.2 接收请求
针对于请求的响应数据，我们需要根据实际的返回数据格式进行相应的处理。这里举个栗子，假如我们请求的接口返回的数据结构如下：
{
"code": 200,
"message": "请求成功",
"data": [
{
"id": 1,
"name": "张三",
"age": 20
},
{
"id": 2,
"name": "李四",
"age": 21
}
]
}
则我们需要根据该结构进行数据的解析，示例代码如下：
// 在需要发送请求的页面中引入wx.request接口
import { request } from '../../src/utils/request.js'
Page({
data: {
result: ''
},
onLoad: function () {
let _this = this
// 发送GET请求
request({
url: 'http://example.com/api/getData',
method: 'GET',
success: function (res) {
// 根据data字段解析返回结果
let data = JSON.parse(res.data.data)
// 遍历data数组，将数据展示到页面中
let result = ''
for (let i = 0; i < data.length; i++) {
result += '姓名：' + data[i].name + ' 年龄：' + data[i].age + '\n'
}
_this.setData({
result: result
})
}
})
}
})
在代码中，我们首先在success回调函数中使用JSON.parse解析返回数据中的data字段数据，并使用for循环将数据展示到了页面中。
4.总结
本文主要介绍了如何使用wx.request发送请求，包括请求的相关配置参数和响应的数据处理方式，读者可以根据自己实际的开发需求进行相应的业务逻辑处理。同时，有了数据请求的基础知识和技巧，我们可以更加灵活地处理小程序中的业务需求，从而提高开发效率。