微信小程序 | 10.wx.request( )发送请求

0.前言

尝试过直接使用之前在Vue用过的封装的axios工具包，发现小程序似乎并不适配axios，很可能是我某些步骤不兼容导致的。我没有深究，还请研究过的朋友指点一下

1.当发送请求到ip服务器(没有域名)时

若请求是发送到没有域名的服务器(如"http://123.45.67.89:4321")，在默认设置下请求是无法发送的。

此时在右上角的"详情"中，将"不校验合法域名…"打开，即可在开发者工具中发送请求。

如果使用真机调试的话，则需要在右上角打开调试

2.wx.request(Object object)

wx.request(Object object)说明文档

通常需要配置的属性有以下：

属性	类型	说明
url	string	服务器接口的地址
method	HTTP请求方法	默认为GET
data	Object	请求的参数。post请求发送对象时，不需要进一步封装
header	Object	content-type的默认值是application/json
success	function	接口调用成功的回调函数
fail	function	接口调用失败的回调函数

3.特别说明：POST请求发送的参数是对象时

发送GET请求时，若需要发送多个参数，需要先将这些参数封装成对象：

// 将参数封装成名为param的对象
const param = {
    name: "zs",
    sex: 1
}

// 调用api时，将变量param作为参数传给data
wx.request({
    url: "xxx",
    method: "GET",
    data: param,
    success(res) {
      // 输出响应内容到控制台
    	console.log(res);
		}
})

但如果是POST请求，且接口的参数是本身就是对象时，就不需要再将这个对象进行额外封装了：

// 接口接收的对象参数
const user = {
    name: "zs",
    sex: 1
}

// 1. 以下是正确的参数传入方式
wx.request({
    url: "xxx",
    method: "POST",
    // 直接将这个对象作为参数传入，不需要再额外封装
    data: user,
    success(res) {
        console.log(res);
    }
})



// 2. 以下是错误的参数传入方式

// 错误的方式：额外进行一次封装
const param = {
    user: user
}
wx.request({
    url: "xxx",
    method: "POST",
    // 以下是错误的：
    data: param,
    success(res) {
        console.log(res);
    }
})