微信小程序request请求封装

写的不好，欢迎大神们指点。谢谢！

当在项目中获取后台数据时，会应用到 wx.request({}) 发起https网络请求。
项目中需求： 如果是 POST请求 接口，进行MD5加密。根据实际需求即可。

文章目录

微信小程序request请求封装

API
完整request请求

1. 下载并引入`md5.js`文件
2. 在`request.js`文件中封装方法

`GET`请求方法
`POST`请求方法
返回数据处理
JSON数据排序方法
导出模块

在项目中如何使用？

1. 引入`request.js`文件
2. 使用

`get`方式
`post`方式

API

wx.request网络请求API

完整request请求

说明：

这里把request请求单独放在一个js文件中。新建request.js
为了方便查看，这里分开写。需要使用时，可以直接按顺序copyrequest.js方法即可。

1. 下载并引入`md5.js`文件

微信小程序使用md5加密参考：

2. 在`request.js`文件中封装方法

//获取应用实例const app = getApp()import md5 from 'md5.js';var TOKEN_KEY = 'Authorized-Token'var url ='https://域名';var rootDocment = url+'/api/';var header = {  'Accept': 'application/json',  'content-type': 'application/json',}

`GET`请求方法

/*** url: 请求地址* cb： 回调函数* toast作用： 请求接口时， 显示loadding， 默认"显示"*/function getReq(url, cb, toast = true) {    var token = wx.getStorageSync(TOKEN_KEY) || ''    if (token) {        header[TOKEN_KEY] = token;    }    if (toast) {        wx.showLoading({            title: '加载中',        })    }    // console.log("token==" + token),    wx.request({        url: rootDocment + url,        method: 'get',        header: header,        success: function (res) {            if (toast) {                  wx.hideLoading();            }            return  response_chuli(res, cb);        },        fail: function () {            if (toast) {                  wx.hideLoading();            }            wx.showModal({                title: '网络错误',                content: '网络出错，请刷新重试',                showCancel: false            })            return typeof cb == "function" && cb(false)        }    })}

`POST`请求方法

/*** url: 请求地址* data: 参数* cb： 回调函数* toast作用： 请求接口时， 显示loadding， 默认"显示"*/function postReq(url, data, cb, toast = true) {    var token = wx.getStorageSync(TOKEN_KEY) || ''    if (token) {        header[TOKEN_KEY] = token;    }    if (toast){        wx.showLoading({            title: '加载中',        })    }        //以下是 md5加密相关    var appkey ='Abcdefghigk2019';  //测试    var newObj = objKeySort(data);  //数据排序    //console.log(newObj);    let connects = '';    for(let item in newObj){        connects += newObj[item];    }    // 拼接格式登录： 15899999999123456Abcdefghigk2019  进行加密    connects += appkey;    //console.log(connects);    data.sign = md5(connects);    //console.log("header=="+token),    //console.log(header),        //指定某个接口使用表单提交    if(url=='user/test'){        header['Accept'] = '*/*';        header['content-type'] = 'application/x-www-form-urlencoded';    }    wx.request({        url: rootDocment + url,        header: header,        data: data,        method: 'post',        success: function (res) {            if (toast) {                  wx.hideLoading();            }            return   response_handle(res, cb);        },        fail: function () {            if (toast) {                wx.hideLoading();            }            wx.showModal({                title: '网络错误',                content: '网络出错，请刷新重试',                showCancel: false            })            return typeof cb == "function" && cb(false)        }    })}

返回数据处理

//返回处理function response_handle(res, cb) {    if (401 === parseInt(res.status) || 401 === parseInt(res.data.code)) {        //清除缓存        wx.setStorageSync(TOKEN_KEY, '');        wx.setStorageSync('userinfo', '');        wx.navigateTo({            url: '/pages/wxlogin/wxlogin?from=index'         })        return ;    } else if (200 === parseInt(res.data.code)){        var t = res.header[TOKEN_KEY] || "";        t && wx.setStorageSync(TOKEN_KEY, t);    }     return typeof cb == "function" && cb(res.data)}

JSON数据排序方法

//json数据排序function objKeySort(obj,typesort = 'sort') {//排序的函数    if(typesort == 'sort') {        var newkey = Object.keys(obj).sort(); //升序    }else {        var newkey = Object.keys(obj).sort().reverse(); //降序    }    //先用Object内置类的keys方法获取要排序对象的属性名，再利用Array原型上的sort方法对获取的属性名进行排序，newkey是一个数组    var newObj = {};//创建一个新的对象，用于存放排好序的键值对    for (var i = 0; i  newkey.length; i++) {//遍历newkey数组        newObj[newkey[i]] = obj[newkey[i]];//向新创建的对象中按照排好的顺序依次增加键值对    }    return newObj;//返回排好序的新对象}

导出模块

module.exports = {    getReq: getReq,    postReq: postReq,    header: header,    rootDocment: rootDocment,    url: url,}

在项目中如何使用？

1. 引入`request.js`文件

var http = require('../../../utils/request.js');

2. 使用

`get`方式

getMeasureList: function() {    var that = this;    var params = 'p=' + that.data.p + '&page_size=' + that.data.page_size;   //调用get方法    http.getReq("user/gaugerecord?" + params, function(res) {        if (res.code != 200) {            feedbackApi.showToast({                title: res.msg,                mask: false            })            return        }        let datas = res.data;         }, false) //false代表不显示loadding},

`post`方式

getQrcodeDeviceInfo: function() {    let that = this;    let params = {        "combo_code": that.data.comboCode    }        //调用post方法    http.postReq('user/getmacs', params, function(res) {        wx.removeStorageSync('qrCodeData');        if (res.code != 200) {            feedbackApi.showToast({                title: res.msg,                mask: false            })            return;        }        let datas = res.data;            })},