前言：
在開發(fā)過程中瘟栖，最重要的還是網(wǎng)絡(luò)請求了，沒有鏈接服務(wù)器的app與咸魚有什么區(qū)別蟹地，今天就來介紹下微信小程序中的網(wǎng)絡(luò)請求api：
微信小程序?qū)W(wǎng)絡(luò)的要求非常高碴开，首先服務(wù)器必須是配置 HTTPS 才能進(jìn)行請求德谅，而且對于小程序開發(fā)必須在開發(fā)者賬號中設(shè)置域名并且通過TLS版本的檢測才能請求熏瞄，但是在平常自己寫demo的時候沒必要配置拍埠，我們只需要在開發(fā)工具中設(shè)置：開發(fā)環(huán)境下不校驗(yàn)請求域名以及TLS版本秸抚。
wx.request發(fā)起的是 HTTPS 請求豌蟋。
OBJECT參數(shù)說明：
參數(shù)名類型必填說明
urlString是開發(fā)者服務(wù)器接口地址
dataObject廊散、String否請求的參數(shù)
headerObject否設(shè)置請求的 header , header 中不能設(shè)置 Referer
methodString否默認(rèn)為 GET，有效值：OPTIONS, GET, HEAD, POST, PUT, DELETE, TRACE, CONNECT
dataTypeString否默認(rèn)為 json梧疲。如果設(shè)置了 dataType 為 json奸汇，則會嘗試對響應(yīng)的數(shù)據(jù)做一次 JSON.parse
successFunction否收到開發(fā)者服務(wù)成功返回的回調(diào)函數(shù)，res = {data: '開發(fā)者服務(wù)器返回的內(nèi)容'}
failFunction否接口調(diào)用失敗的回調(diào)函數(shù)
completeFunction否接口調(diào)用結(jié)束的回調(diào)函數(shù)（調(diào)用成功往声、失敗都會執(zhí)行）
data 數(shù)據(jù)說明最終發(fā)送給服務(wù)器的數(shù)據(jù)是 String 類型擂找，如果傳入的 data 不是 String 類型，會被轉(zhuǎn)換成 String 浩销。轉(zhuǎn)換規(guī)則如下：
對于 header['content-type'] 為 'application/json' 的數(shù)據(jù)贯涎，會對數(shù)據(jù)進(jìn)行 JSON 序列化
對于 header['content-type'] 為 'application/x-www-form-urlencoded' 的數(shù)據(jù)，會將數(shù)據(jù)轉(zhuǎn)換成 query string （encodeURIComponent(k)=encodeURIComponent(v)&encodeURIComponent(k)=encodeURIComponent(v)...）
示例代碼：
wx.request({
url:?'test.php',?//僅為示例慢洋，并非真實(shí)的接口地址
data:?{
x:?''?,
y:?''
},
header:?{
'content-type':?'application/json'
},
success:?function(res)?{
console.log(res.data)
}
})
Bug & Tip
tip: content-type 默認(rèn)為 'application/json'
tip: 客戶端的 HTTPS TLS 版本為1.2塘雳，但Android的部分機(jī)型還未支持 TLS 1.2，所以請確保 HTTPS 服務(wù)器的 TLS 版本支持1.2及以下版本普筹；
tip: 要注意 method 的 value 必須為大寫（例如：GET）败明；
tip: url 中不能有端口；
tip: request 的默認(rèn)超時時間和最大超時時間都是 60s
tip: request 的最大并發(fā)數(shù)是 5
tip: 網(wǎng)絡(luò)請求的 referer 是不可以設(shè)置的太防，格式固定為https://servicewechat.com/{appid}/{version}/page-frame.html妻顶，其中{appid}為小程序的 appid，{version}為小程序的版本號蜒车，版本號為 0 表示為開發(fā)版讳嘱。
上一章我們提到了微信小程序模塊化，因?yàn)樵陧?xiàng)目中網(wǎng)絡(luò)請求的次數(shù)非常多酿愧，所以我們可以把網(wǎng)絡(luò)請求模塊化沥潭。
首先我們可以看到這里的網(wǎng)絡(luò)請求的api中的代碼中變化的屬性：
url：開發(fā)者服務(wù)器接口地址，每個接口的地址都是不同的嬉挡。
data：post請求的時候附帶的參數(shù)钝鸽。
method ：一般情況下只使用 post 和 get
我在utils文件夾下創(chuàng)建了network.js用來封裝小程序的網(wǎng)絡(luò)請求。
function GetData(url, data, method,success, fail, complete) {
console.log("post url:[" + url + ']');
wx.request({
url: url,
data: data,
method: method, // OPTIONS, GET, HEAD, POST, PUT, DELETE, TRACE, CONNECT
header: {
'content-type': 'application/json'
},
success: function (res) {
success(res);
},
fail: function (res) {
fail(res);
},
complete: function (res) {
complete(res);
}
})
console.log("----end-----post----");
}
在使用的時候只需要提供
var network = require('../../utils/network.js')
// 頁面顯示
var that = this;
var method='GET',
var data = {
city: "杭州",
start: 0,
count:5
}
注意這里是可用的鏈接庞钢，使用的豆瓣的api拔恰，可以獲取到數(shù)據(jù)。
var index_filmurl="https://api.getweapp.com/vendor/douban/coming_soon";
network.GetData(index_filmurl, data,method, function (res) {
console.log(res)
that.setData({
//這里獲取到服務(wù)器的數(shù)據(jù)焊夸，并且賦值給data中定義的數(shù)據(jù)
})
}, function (res) {
},
function (res) {
})
以上就是網(wǎng)絡(luò)請求的模塊仁连，需要注意的幾點(diǎn)：
第一個function代表請求成功的回調(diào)
第二個function代表請求失敗的回掉
第三個function代表請求完成（不管失敗還是成功都有回調(diào)）的回調(diào)
1：還是模板的基本使用方法，在utils.js文件中使用module.exports把網(wǎng)絡(luò)請求接口暴露出去
在使用使用require引入utils.js文件阱穗。
2：在使用data中直接把需要提交的數(shù)據(jù)寫入到data對象中饭冬，傳遞過去。
3：采用方法請求的回調(diào)：
因?yàn)槭悄K揪阶，很多不同的接口同時都是調(diào)用昌抠，但是每個接口需要更改的數(shù)據(jù)都不同，不能寫死的鲁僚，所以我們必須使用回調(diào)到調(diào)用的方法中執(zhí)行數(shù)據(jù)更新
首先我們必須對js中的回調(diào)函數(shù)和方法function又一定的了解：
在JavaScrip中炊苫，function是內(nèi)置的類對象，也就是說它是一種類型的對象冰沙，可以和其它String侨艾、Array、Number拓挥、Object類的對象一樣用于內(nèi)置對象的管理唠梨。因?yàn)閒unction實(shí)際上是一種對象，它可以“存儲在變量中侥啤，通過參數(shù)傳遞給(別一個)函數(shù)(function)当叭，在函數(shù)內(nèi)部創(chuàng)建，從函數(shù)中返回結(jié)果值”盖灸。
因?yàn)閒unction是內(nèi)置對象蚁鳖，我們可以將它作為參數(shù)傳遞給另一個函數(shù)，延遲到函數(shù)中執(zhí)行赁炎，甚至執(zhí)行后將它返回醉箕。這是在JavaScript中使用回調(diào)函數(shù)的精髓。
看了上面對js文件中function的解釋徙垫，應(yīng)該就對上面回調(diào)的使用應(yīng)該很清楚了吧琅攘。
