微信小程序 wx.request 请求封装

1、添加一些统一的参数或者配置

2、加上默认的请求头和cookie(有就加,没有就为空)

3、将参数,即传入的url地址、请求头传入请求中

4、封装 post 和 get 请求,使代码使用更加方便,以维护

function request(options) {
  // 请求拦截器
  //  ...
  // 1. 加一些统一的参数,或者配置
  if (!options.url.startsWith("https://") && !options.url.startsWith("http://")) {
    options.url = "默认开头" + options.url
  }
	// 2. 默认的请求头
  let header = {
    "content-type": "application/x-www-form-urlencoded",
    // 加上统一的cookie
    "cookie": wx.getStorageSync("cookie") || ""
  };
  if (options.header) {
    header = {
      ...header,
      ...options.header
    }
  }

  return new Promise((reslove, reject) => {
    // 3.调用接口
    wx.request({
      // 默认的配置
      // 加载传入的配置
      ...options,
      header,
      success(res) {
        // 响应拦截器,所有接口获取数据之前,都会先执行这里
        //  统一的错误处理
        if (res.statusCode != 200) {
          wx.showToast({
            title: '服务器异常,请联系管理员',
          })
        }

        reslove(res)
      },
      fail(err) {
        reject(err)
      }
    })
  })
}

// 4、封装 post get 方法
export function get(url, options = {}) {
  return request({
    url,
    ...options
  })
}

export function post(url, data, options = {}) {
  return request({
    url,
    data,
    method: "POST",
    ...options
  })
}

你可能感兴趣的:(前端,微信小程序,微信小程序,小程序)