前几天老板让写一个扫码收货的小功能,因为功能简单,没必要单独进行app开发了,所以让做一个微信小程序来实现这个功能,前后端交互过程中要后端要求携带token,于是按照vue项目惯例对微信中的wx.request常用get、post、put、delete进行了封装,思路如下。
首先在pages中新建一个api的文件夹,对ajax请求统一管理,文件夹中request.js完成对wx.request的封装,在index.js中完成接口管理,目录如下图:
在request.js中对wx.request进行封装,代码如下:
var tokenKey = "access-token";
var serverUrl = "http://124.204.51.174:8080/gcs";
// 例外不用token的地址
var exceptionAddrArr = [ '/user/login',];
//请求头处理函数
function CreateHeader(url, type) {
let header = {}
if (type == 'POST_PARAMS'){
header = {
'content-type': 'application/x-www-form-urlencoded'
}
}else{
header = {
'content-type': 'application/json'
}
}
if (exceptionAddrArr.indexOf(url) == -1) { //排除请求的地址不需要token的地址
let token = wx.getStorageSync(tokenKey);
// header.Authorization = token;
header['access-token'] = tok