wx小程序封装ajax请求在header中添加token

最新推荐文章于 2022-04-19 17:05:51 发布

刘炳岗

最新推荐文章于 2022-04-19 17:05:51 发布

阅读量1.5k

点赞数

文章标签： ajax http javascript vue.js

本文链接：https://blog.youkuaiyun.com/weixin_42272558/article/details/114981042

版权

本文介绍了一种在微信小程序中对网络请求进行封装的方法，包括GET、POST等请求方式，并针对不同场景进行了优化处理，如自动加入认证令牌、区分是否需要认证等功能。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

将wx.request的封装进行复用

const tokenKey = "access-token";
const serverUrl = getApp().globalData.URL;

// 例外不用token的地址
const exceptionAddrArr = ['/user/login',];
const token = wx.getStorageSync('access_token');
//请求头处理函数
function CreateHeader(url, type) {
        console.log(token)
        let header = {}
        if (type == 'POST_PARAMS') {
                header = {
                        'content-type': 'application/x-www-form-urlencoded',
                        'TENANT-ID': '1',
                        'Authorization': 'Basic cGlnOnBpZw=='
                }
        } else {
                header = {
                        'content-type': 'application/json',
                        'TENANT-ID': '1',
                        'Authorization': 'Bearer ' + token
                }
        }

        //排除请求的地址不需要token的地址
        if (exceptionAddrArr.indexOf(url) == -1) {
                let token = wx.getStorageSync(tokenKey);
                header['access-token'] = token;
        }
        return header;
}

//post请求，数据在body中
function postRequest(url, data) {
        let header = CreateHeader(url, 'POST');
        return new Promise((resolve, reject) => {
                wx.request({
                        url: serverUrl + url,
                        data: data,
                        header: header,
                        method: 'POST',
                        success: (res => {
                                if (res.statusCode === 200) {
                                        resolve(res)
                                } else {
                                        reject(res)
                                }
                        }),
                        fail: (res => {
                                reject(res)
                        })
                })
        })
}

//post请求，数据按照query方式传给后端
function postParamsRequest(url, data) {
        let header = CreateHeader(url, 'POST_PARAMS');
        return new Promise((resolve, reject) => {
                wx.request({
                        url: serverUrl + url,
                        data: data,
                        header: header,
                        method: 'POST',
                        success: (res => {
                                if (res.statusCode === 200) {
                                        resolve(res)
                                } else {
                                        reject(res)
                                }
                        }),
                        fail: (res => {
                                reject(res)
                        })
                })
        })
}

//get 请求
function getRequest(url, data) {
        let header = CreateHeader(url, 'GET');
        return new Promise((resolve, reject) => {
                wx.request({
                        url: serverUrl + url,
                        data: data,
                        header: header,
                        method: 'GET',
                        success: (res => {
                                if (res.statusCode === 200) {
                                        resolve(res)
                                } else {
                                        reject(res)
                                }
                        }),
                        fail: (res => {
                                reject(res)
                        })
                })
        })
}


module.exports.getRequest = getRequest;
module.exports.postRequest = postRequest;
module.exports.postParamsRequest = postParamsRequest;

然后再其他页面进行引用