開發(fā)小程序，封裝有一個簡單易用wx.request請求還是很必要的，可以省去大量的維護成本！閑話不多說，直接擼代碼。

流程

創(chuàng)建http.js文件，封裝wx.request

在utils中創(chuàng)建http.js文件，封裝http，代碼如下：

module.exports = { http(url, method, params) {  let token = 'token' // 獲取token，自行獲取token和簽名，token和簽名表示每個接口都要發(fā)送的數(shù)據(jù)  let sign = 'sign' // 獲取簽名  let data = {    token,    sign  }  if(params.data){ // 在這里判斷一下data是否存在，params表示前端需要傳遞的數(shù)據(jù)，params是一個對象，有三組鍵值對，data：表示請求要發(fā)送的數(shù)據(jù)，success：成功的回調(diào)，fail：失敗的回調(diào)，這三個字段可缺可無，其余字段會忽略   for (let key in params.data) { // 在這里判斷傳過來的參數(shù)值為null，就刪除這個屬性    if (params.data[key] == null || params.data[key] == 'null') {     delete params.data[key]    }   }   data = {...data,...params.data}  }  wx.request({   url:'https://www.apiopen.top'+url, // 就是拼接上前綴,此接口域名是開放接口，可訪問   method:method=='post'?'post':'get', // 判斷請求類型，除了值等于'post'外，其余值均視作get   data,   header: {    'content-type': 'application/json'   },   success(res) {    params.success&¶ms.success(res.data)   },   fail(err) {    params.fail&¶ms.fail(err)   }  }) }}

代碼很簡單，需要說的是在邏輯代碼中只需要傳遞params，而url和method在接口文件中傳遞，方便統(tǒng)一管理

創(chuàng)建api.js文件，統(tǒng)一管理所有接口

在utils下創(chuàng)建api.js文件，作為接口管理文件，代碼如下：

// 在這里面定義所有接口，一個文件管理所有接口，易于維護import {http} from './http'; // 引入剛剛封裝好的http模塊，import屬于ES6的語法，微信開發(fā)者工具必須打開ES6轉(zhuǎn)ES5選項function femaleNameApi(params){ // 請求隨機古詩詞接口 http('/femaleNameApi','get',params) // 接口請求的路由地址以及請求方法在此處傳遞}// 每一個接口定義一個函數(shù)，然后暴露出去，供邏輯代碼調(diào)用function novelApi(params){ // 小說推薦接口 http('/novelApi','get',params) }export default { // 暴露接口 femaleNameApi, novelApi}

用api.js文件統(tǒng)一管理的好處就是，當接口更新后修改很方便，不需要看邏輯代碼，也不用關(guān)心有幾處調(diào)用了此接口，直接在app.js中修改響應(yīng)就行了，接口統(tǒng)一管理是非常有必要的

在index.js中調(diào)用接口

調(diào)用方式，代碼如下

import http from '../utils/api' // 引入api接口管理文件Page({ data: {  femaleList:[] }, onLoad: function () {  http.femaleNameApi({ // 調(diào)用接口，傳入?yún)?shù)   data:{    page:1   },   success:res=>{    console.log('接口請求成功',res)    this.setData({     femaleList:res.data    })   },   fail:err=>{    console.log(err)   }  }) }})