小程序请求拦截,响应拦截

前端在使用数据请求的时候,一般为了安全考虑都会添加请求头,以及token检验等操作,还有根据后端返回的不同状态进行不同处理,例如:后台返回token超时,我们就需要重新获取token,然后才能请求数据.

首先是通用方法:就是参数有点麻烦,每次使用都需要传很多参数,并且很多都是重复的,不是很友好.

export function wxPromise(fn) {
  return function (obj = {}) {
    return new Promise((resolve, reject) => {
      obj.success = res => {
        resolve(res)
      };
      obj.fail = res => {
        reject(res)
      };
      fn(obj)
    })
  }
}

然后优化一下,分别封装POST以及GET请求

// 这是对post请求的封装
export function post(url, data = {}) {
  return new Promise((resolve, reject) => {
    //网络请求
    //console.log(baseUrl)
    wx.request({
      url: baseUrl + url,
      data,
      method: 'POST',
      header: {
        "Content-Type": "application/json",
        'token': app.globalData.token,
        'openId': app.globalData.openid
      },
      success: function (res) {//服务器返回数据
      //console.log("cg")
        resolve(res);
      },
      fail: function (error) {
        //console.log("sb")
        reject(error);
      }
    })
  });
}
// 这是对get请求的封装
export function get(url, data = {}) {
  return new Promise((resolve, reject) => {
    //网络请求
    wx.request({
      url: baseUrl + url,
      data,
      method: 'GET',
      header: {
        "Content-Type": "application/json",
        'token': app.globalData.token,
        'openId': app.globalData.openid
      },
      success: function (res) {//服务器返回数据
        resolve(res);
      },
      fail: function (error) {
        reject(error);
      }
    })
  });
}

然后我们在使用的时候就只需要传入url以及参数就可以了,如果有需要还可以在以上封装中对参数  以及后端返回的数据进行处理,还有状态的处理等,根据自己项目需要吧.

原文地址:https://www.cnblogs.com/wgs-blog/p/14921462.html