微信小程序 wx.request----接口調(diào)用方式

    最近開發(fā)了一個(gè)微信小程序版的任務(wù)管理系統(tǒng)，在向Java后臺(tái)發(fā)送接口時(shí)遇到了一些問題，在這里做一個(gè)簡(jiǎn)單的總結(jié)。

官方接口

官方給出的接口叫做wx.request，請(qǐng)求方式比較簡(jiǎn)單，下面是官網(wǎng)給出的請(qǐng)求實(shí)例。

wx.request({
 url: 'test.php', //僅為示例，并非真實(shí)的接口地址
 data: {
   x: '' ,
   y: ''
 },
 header: {
   'content-type': 'application/json'
 },
 success: function(res) {
  console.log(res.data)
 }
})

存在的問題

wx.request請(qǐng)求的header中content-type默認(rèn)為application/json，如果我們想換種方式比如用"application/x-www-form-urlencoded"會(huì)發(fā)現(xiàn)在請(qǐng)求頭信息中并沒有取代默認(rèn)的application/json而是新增了這種方式，另外在用jquery.ajax請(qǐng)求時(shí)即便同樣使用application/json方式來請(qǐng)求，得到的數(shù)據(jù)格式也不相同，無論用什么請(qǐng)求方式ajax都會(huì)將請(qǐng)求數(shù)據(jù)轉(zhuǎn)換為&name1=value1&name2=value2的形式，這樣在根據(jù)content-type來解析請(qǐng)求數(shù)據(jù)時(shí)就會(huì)出現(xiàn)問題，不知道微信是有意這樣做還是它根本就是個(gè)bug?？傊墙o我?guī)砹瞬槐匾穆闊?br />

微信小程序發(fā)送的是https請(qǐng)求，在本地調(diào)試時(shí)可以用http，如果放在手機(jī)上測(cè)試時(shí)校驗(yàn)請(qǐng)求方式和域名，不合法會(huì)報(bào)以下錯(cuò)誤：

為了方便請(qǐng)求，可以對(duì)wx.request做一個(gè)簡(jiǎn)單的封裝，這樣我們?cè)僬{(diào)用的時(shí)候就方便了許多，代碼如下：

var app = getApp();
function request(url,postData,doSuccess,doFail,doComplete){
   var host = getApp().conf.host;
   wx.request({
    url: host+url,
    data:postData,
    method: 'POST', 
    success: function(res){
     if(typeof doSuccess == "function"){
       doSuccess(res);
     }
    },
    fail: function() {
     if(typeof doFail == "function"){
       doFail();
     }
    },
    complete: function() {
     if(typeof doComplete == "function"){
       doComplete();
     }
    }
   });
 }
}

module.exports.request = request;

如果一個(gè)接口在不同地方頻繁用到，原本設(shè)想寫一個(gè)函數(shù)，然后將函數(shù)暴露供其他js調(diào)用，但后來發(fā)現(xiàn)wx.request中設(shè)置async是無效的，只能發(fā)異步請(qǐng)求，所以如果想寫一個(gè)函數(shù)來返回調(diào)用接口得到的數(shù)據(jù)就比較難實(shí)現(xiàn)。

感謝閱讀，希望能幫助到大家，謝謝大家對(duì)本站的支持！