微信小程序-（六）发起数据请求

本文最后更新于：March 27, 2022 pm

微信小程序，小程序的一种，英文名Wechat Mini Program，是一种不需要下载安装即可使用的应用，它实现了应用“触手可及”的梦想，用户扫一扫或搜一下即可打开应用。也体现了“用完即走”的理念，用户不用关心是否安装太多应用的问题。应用将无处不在，随时可用，但又无需安装卸载。对于开发者而言，微信小程序开发门槛相对较低，难度不及APP，能够满足简单的基础应用，适合生活服务类线下商铺以及非刚需低频应用的转换。

目录

限制

  • 只能请求HTTPS类型的接口。
  • 必须将接口的域名添加到信任列表中。

注意事项

  • 域名只支持https协议
  • 域名不能使用IP地址或localhost
  • 域名必须ICP备案

前提

首先需要将域名加入到 request合法域名 里面。

GET请求

调用微信小程序提供的 wx.request() 方法，发起GET数据请求：

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
// pages/list/list.js
Page({
  getD(){ //触发事件
    wx.request({ //发送请求
      url: 'https://www.escook.cn/api/get',
      method: 'GET',
      data:{
        name: 'zs',
        age: 22
      },
      success:(res)=>{
        console.log(res);
        console.log(res.data);
      },
      fail:(err)=>{
        console.log(err);
      }
    })
  }
})

POST请求

和GET请求类似。

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
// pages/list/list.js
Page({
  getD(){ //触发事件
    wx.request({ //发送请求
      url: 'https://www.escook.cn/api/post',
      method: 'post',
      data:{
        name: 'ls',
        age: 33
      },
      success:(res)=>{
        console.log(res);
        console.log(res.data);
      },
      fail:(err)=>{
        console.log(err);
      }
    })
  }
})

页面加载时请求数据

即初始化数据。此时需要在页面的 onLoad 事件中调用获取数据的函数。

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
33
34
  // pages/list/list.js
Page({
  getD(){ //触发事件
    wx.request({ //发送请求
      url: 'https://www.escook.cn/api/post',
      method: 'post',
      data:{
        name: 'ls',
        age: 33
      },
      success:(res)=>{
        console.log(res);
        console.log(res.data);
      },
      fail:(err)=>{
        console.log(err);
      }
    })
  },
  
  /**
   * 生命周期函数--监听页面加载
   */
  onLoad(options) {
     this.getD()
  },

  /**
   * 生命周期函数--监听页面初次渲染完成
   */
  onReady() {
  //放在这里也可以实现加载进来就发送请求
  },
})