微信小程序之封装wx.request拦截器

前言

微信小程序通常使用wx.request发起 HTTPS 网络请求
微信小程序官方说明文档:https://developers.weixin.qq.com/miniprogram/dev/api/network/request/wx.request.html

在接口请求中,经常会遇到需要拦截器的场景,如统一接口报错提示、统一登录跳转、统一header配置。

wx.request拦截器
  • network.js
/**
 * @module request
 * 网络ajax请求,并默认处理失败和成功提示等,并保留原来wx.request全部功能。
 * @param {object} requestObject  跟wx.request相同的请求参数
 */
 var app = getApp()
 function request(requestObject) {
  /* headers统一配置 */
  if(!requestObject||!requestObject.header){
    requestObject.header = {}
  }
  /* request事件拦截 */
  var old_complate = requestObject.complete  
  var old_success = requestObject.success  
  var old_fail = requestObject.fail  
  /* request成功 */
  requestObject.success = function (res) {  
    old_success && old_success(res)
    const code = res.data.code 
    // 认证令牌有误或已过期,请重新获取;强制跳转到登录页面
    if (['AUTHORIZATION_SESSION_NOT_FOUND', 'AUTHORIZE_TOKEN_INVALID'].includes(code)){
      wx.removeStorageSync('access_token')
      wx.removeStorageSync('userInfo')
      wx.showModal({
        content: res.data.message,
        showCancel: false,
        success: () => {
          wx.reLaunch({
            url: '/pages/login/login'
          })
        }
      })
      return
    }
    if (code === 'SUCCESS') {
      return
    }
    app.showToast(res.data.message)
  }
  /* request失败 */
  requestObject.fail = function (res) {
    old_fail && old_fail(res)
    app.showToast(res.data.message) 
  }
  /* request完成 */
  requestObject.complete = function (res) {
    old_complate && old_complate(res)
  }
  var requestTask = wx.request(requestObject)
  return requestTask  
}
module.exports = {
  request
}
  • 拦截器的使用:配置与wx.request(requestObject)完全一致
const net = require('../../utils/network.js');
net.request({
      url: ``,
      method: 'post',
      data: { },
      header: { },
      success: res => { },
      fail: res => { },
      complete: res => { }
    })
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容