微信小程序request封裝
Request的做小程序是必不可少的，所有后端網(wǎng)絡(luò)請(qǐng)求都要用到request,雖然微信的request相對(duì)來說已經(jīng)很簡潔，但對(duì)http status code的判斷，處理異常都不是很方便
首先新建一個(gè)request.js
 
class request {
  constructor() {
    this._header = {'content-type': 'application/x-www-form-urlencoded'}
  }
 
  /**
   * 設(shè)置統(tǒng)一的異常處理
   */
  setErrorHandler(handler) {
    this._errorHandler = handler;
  }
 
  /**
   * GET類型的網(wǎng)絡(luò)請(qǐng)求
   */
  getRequest(url, data, header = this._header) {
    return this.requestAll(url, data, header, 'GET')
  }
 
  /**
   * DELETE類型的網(wǎng)絡(luò)請(qǐng)求
   */
  deleteRequest(url, data, header = this._header) {
    return this.requestAll(url, data, header, 'DELETE')
  }
 
  /**
   * PUT類型的網(wǎng)絡(luò)請(qǐng)求
   */
  putRequest(url, data, header = this._header) {
    return this.requestAll(url, data, header, 'PUT')
  }
 
  /**
   * POST類型的網(wǎng)絡(luò)請(qǐng)求
   */
  postRequest(url, data, header = this._header) {
    return this.requestAll(url, data, header, 'POST')
  }
 
  /**
   * 網(wǎng)絡(luò)請(qǐng)求
   */
  requestAll(url, data, header, method) {
    return new Promise((resolve, reject) => {
      wx.request({
        url: url,
        data: data,
        header: header,
        method: method,
        success: (res => {
          if (res.statusCode === 200) {
            //200: 服務(wù)端業(yè)務(wù)處理正常結(jié)束
            resolve(res) 
            //請(qǐng)求返回401 跳轉(zhuǎn)登陸          
            if(res.data.code=="401"){
              wx.reLaunch({
                url: '/pages/login/index',
              })
            }       
          } else {
            //其它錯(cuò)誤，提示用戶錯(cuò)誤信息
            if (this._errorHandler != null) {
              //如果有統(tǒng)一的異常處理，就先調(diào)用統(tǒng)一異常處理函數(shù)對(duì)異常進(jìn)行處理
              this._errorHandler(res)
            }
            reject(res)
          }
        }),
        fail: (res => {
          if (this._errorHandler != null) {
            this._errorHandler(res)
          }
          reject(res)
        })
      })
    })
  }
}
 
export default request
 
 
新建getApi.js
 
import request from './request.js'
import utilMd5 from './md5.js'
class getApi{
  constructor() {
    this._baseUrl = 'https:xxxx'
    this._defaultHeader = {
      'data-tupe': 'application/json'
    }
    this._request = new request
    this._request.setErrorHandler(this.errorHander)
    this._key = 'szfangwei_net'
  }
 
  /**
   * timestamp
   */
  timestamp() {
    //獲取當(dāng)前時(shí)間戳
    let timestamp = Date.parse(new Date());
    timestamp = timestamp / 1000;
    //獲取當(dāng)前時(shí)間
    let n = timestamp * 1000;
    let date = new Date(n);
    let Y = date.getFullYear(); //年   
    let M = (date.getMonth() + 1 < 10 ? '0' + (date.getMonth() + 1) : date.getMonth() + 1); //月   
    let D = date.getDate() < 10 ? '0' + date.getDate() : date.getDate(); //日   
    let h = date.getHours(); //時(shí)   
    let m = date.getMinutes(); //分   
    let s = date.getSeconds(); //秒
    return Y.toString() + M + D + h + m + s;
  }
 
  /**
   * 公共參數(shù)
   */
  connDate(data) {
    let timestamp = this.timestamp();
    let conn = {
      timestamp: timestamp,
      token: utilMd5.hexMD5(timestamp + this._key),
    }
    return Object.assign(conn, data);
  }
 
  /**
   * 統(tǒng)一的異常處理方法
   */
  errorHander(res) {
    console.error(res)
  }
 
 
 
  /**
   * 驗(yàn)證token
   */
  getToken(session3rd) {
    let url = "User/xxx"
    let data = {
      device_token: 'wechat',
      session3rd: session3rd
    }
    return this._request.getRequest(this._baseUrl + url, this.connDate(data)).then(res => res.data)
  }
 
 
 
 
 
 
  /**
   * 獲取項(xiàng)目
   */
  getProject(session3rd, userID, cpage,k='') {
    let url = "Project/xx"
    let data = {
      session3rd: session3rd,
      userID: userID,
      cpage: cpage,
      k:k
    }
    return this._request.getRequest(this._baseUrl + url, this.connDate(data)).then(res => res.data)
  }
 
}
export default getApi
 
 
最后在app。Js實(shí)例化
Import getApi from ‘./apis/request.js’
getApi:new getApi()
 
 
在pages里使用
Const app = getApp();

getdataList() {
    app.getApi.getCourseList(this.data.xx)
      .then(res => {
       
        this.setData({
          list: list
        })
      })
      .catch(res => {
        //you code
      })
  },