,

小程序中的网络请求

在小程序中,使用 wx.request( ) 这个方法来发送网路请求,整个请求的方式和 jQuery 里面的 …

在小程序中,使用 wx.request( ) 这个方法来发送网路请求,整个请求的方式和 jQuery 里面的 $.ajax 方法是非常相似的。

在 wx.request( ) 这个方法中,接收一个配置对象,该配置对象中能够配置的项目如下表:

关于服务器接口

有关服务器接口的配置,需要满足以下两点:

  • 要求必须要是 https 接口
  • https 接口对应的域名还必须要在小程序管理平台进行配置

【开发】-【开发管理】-【开发设置】下面有一个【服务器域名】,在这个位置进行配置

我如果是开发环境怎么办?

在开发环境下,因为开发阶段的服务器接口还没部署到现网的域名下,所以我们可以选择不校验 HTTPS 证书,具体的方式如下图所示:

向服务器传递参数

一般来讲,用得比较多的有 GET 和 POST 请求

收到回包

只要收到了服务器返回的信息,都会进入到 success 的回调函数,然后我们再在 success 回调函数中根据服务器返回的内容来做下一步操作。

示例:

// 向服务器发送 Get 请求
sendGet(){
  wx.request({
    url: 'http://localhost:3000',
    data : {
      loginId : this.data.loginId,
      password : this.data.password
    },
    success(e){
      console.log(e);
    }
  })
},
  // 向服务器发送 Post 请求
  sendPost(){
    wx.request({
      url: 'http://localhost:3000/abc',
      method : "POST",
      data : {
        loginId : this.data.loginId,
        password : this.data.password
      },
      success(e){
        console.log(e);
      }
    })
  },

使用技巧

一般来讲,在发送请求的时候,有三点可以优化:

  • 和服务器通信的过程中,需要显示一个 loading 框
    • wx.showLoading( ):显示 loading 框
    • wx.hideLoading( ):隐藏 loading 框
  • 设置超时时间
    • 在 app.json 中设置 networkTimeout
  • 如果处理失败,需要显示一个提示
    • wx.showToast( )

Previous Post

发表回复

您的邮箱地址不会被公开。 必填项已用 * 标注

About the Author

每个人都有自己得时区,在自己得时区里,一切都是准时的。

BlockSpare — News, Magazine and Blog Addons for (Gutenberg) Block Editor