0.前言

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

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

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

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

image-20211103210753285

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

image-20211031185740382

2.wx.request(Object object)

wx.request(Object object)说明文档

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

属性类型说明
urlstring服务器接口的地址
methodHTTP请求方法默认为GET
dataObject请求的参数。post请求发送对象时,不需要进一步封装
headerObjectcontent-type的默认值是application/json
successfunction接口调用成功的回调函数
failfunction接口调用失败的回调函数

image-20211103212248507

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);
    }
})

Logo

前往低代码交流专区

更多推荐