小程序 request请求的封装

封装wx.requst

原因

在小程序的开发过程中。发起 HTTPS 网络请求。要用到wx.request方法。在使用过程中发现。每次调用这个方法发现其中绝大部分的内容都是重复的。这样以来一个js中调用多次https请求会导致代码特别混乱。所以要对wx.request()方法进行封装。

封装步骤

1. 在小程序的根目录新建api的文件夹,并且新建req.js
2. 封装代码

const app = getApp(); 

/**
 * @param {*} url 请求路径
 * @param {*} options 请求参数
 * @param {*} isNeedTocken 是否需要Tocken
 * @param {*} isJson 是否已json形式传给后台, 否则仪表单的形式。
 */
const request = (url, options,isNeedTocken,isJson) => {
   return new Promise((resolve, reject) => {
       wx.request({
           url: `${app.globalData.host}${url}`,//拼接请求路径，读取app.js中的全局变量
           method: options.method,
           data:isJson?JSON.stringify(options.data):options.data ,
           header: {
               'Content-Type':isJson?'application/json':'application/x-www-form-urlencoded',
               'authorization': isNeedTocken?app.globalData.tocken:''  // 看自己是否需要
           },
           success(request) {
               if (request.data.code === 200) {//请求成功的状态码。看每个公司的情况。我习惯使用200来定义成功状态。
                   resolve(request.data)
               } else {
                   reject(request.data)
               }
           },
           fail(error) {
               reject(error.data)
           }
       })
   })
}

/**
*封装get请求
*/
const get = (url, options = {},isNeedTocken = true,isJson = false) => {
   return request(url, { method: 'GET', data: options },isNeedTocken,isJson)
}

/**
* 封装post请求
*/
const post = (url, options,isNeedTocken=true,isJson = false) => {
   return request(url, { method: 'POST', data: options },isNeedTocken,isJson)
}

//暴露接口
module.exports = {
   get,
   post
}

调用

在需调动的js方法中调用
import req from “…/…/api/req”;

然后直接使用就可以了。

 req.post(login,{"phoneOrNumber":phoneOrNumber,"possword":possword},false).then(res =>{
      //处理成功的请求
      }).catch(err=>{
        //请求报错，或者状态码返回错误。
      })