微信小程序的(de)網絡設置，及網絡請求：wx.request(OBJECT)

發表時(shí)間：2021-3-31

發布人(rén)：融晨科技

浏覽次數：79

微信小程序要(yào / yāo)實現網絡請求，首先要(yào / yāo)對其進行設置，下面以(yǐ)”微信web開發者工具V1.01.170913”爲(wéi / wèi)例

一：對于(yú)服務器網站沒有備案，或隻需要(yào / yāo)做本地(dì / de)測試的(de)用戶

在(zài)“微信web開發者工具”的(de)“設置”->“項目設置”->“項目設置”中
選：不(bù)校驗安全域名、TLS 版本以(yǐ)及 HTTPS 證書，如下圖

二：對已有備案的(de)網站服務器用戶

因爲(wéi / wèi)小程序隻支持https的(de)域名,所以(yǐ)先要(yào / yāo)确保自己的(de)網站服務器已安裝了(le／liǎo)SSL證書，至于(yú)怎樣安裝，可參考我之(zhī)前的(de)文章，如下：
一：https的(de)簡單介紹及SSL證書的(de)生成
二：https的(de)SSL證書在(zài)服務器端的(de)部署，基于(yú)tomcat,spring boot
三：讓服務器同時(shí)支持http、https，基于(yú)spring boot
四：https的(de)SSL證書在(zài)Android端基于(yú)okhttp，Retrofit的(de)使用

然後，通過下面兩步設置
1):在(zài)mp.weixin.qq.com中用自己的(de)小程序帳号登錄，在(zài)”設置”->”開發設置”中填寫服務器域名，如下圖：

設置完後，在(zài)“微信web開發者工具”的(de)“設置”->“項目設置”->“域名信息”中會看到(dào)剛在(zài)後台的(de)域名設置，如下圖：

2):在(zài)“微信web開發者工具”的(de)“設置”->“項目設置”->“項目設置”中
不(bù)要(yào / yāo)選：不(bù)校驗安全域名、TLS 版本以(yǐ)及 HTTPS 證書，如下圖

三：設置完成後，就(jiù)開始代碼部分

先設置一個(gè)view用于(yú)顯示收到(dào)服務器應答的(de)數據
再設置一個(gè)button，用于(yú)點擊時(shí)調用”httpRequest()”發起對服務器的(de)請求
pages\index\index.wxml 内容如下：

<!--index.wxml-->
<view class="container">
  <!-- This is our View -->
  <view> Http Receive: {{response}} </view>
  <button bindtap="httpRequest"> http test </button>
</view>

pages\index\index.js内容如下：

// This is our App Service.
// This is our data.
var helloData = {
  response: ‘‘
}
// Register a Page.
Page({
  data: helloData,

  httpRequest: function (e) { //對應：<button bindtap="httpRequest"> http test </button>的(de)button點擊
  var that=this  
    wx.request({
      url: ‘http://127.0.0.1/test‘, //僅爲(wéi / wèi)示例，要(yào / yāo)根據你實際的(de)接口地(dì / de)址   
      data: {
        x: ‘ab‘,
        y: ‘cd‘
      },
      header: {
        ‘content-type‘: ‘application/json‘ // 默認值
      },

      success: function (res) {
        console.log(res.data)       
        that.setData({
          response: res.data //把接收到(dào)的(de)服務器數據顯示到(dào){{response}}中
        })
      }
    })
  }
})

上(shàng)面代碼等同于(yú)訪問：