微信小程序网络请求封装

小伙伴们在公司里可能会碰到用原生语法开发的，这里就会碰到需要发起请求，需要携带token，不用拼接过多的路径，以及token失效返回登录页的重定向等操作可以使用更加方便下面就是配置请求；

1：第一步可以在项目目录下创建一个request文件夹我这里是为了方便在utils文件夹里创建了一个request.js文件

 2：下面是request.js文件的配置代码；

const baseURL = '项目的基地址 https:xxxxxx';

async function request(url, method, data) {
  const token = wx.getStorageSync('token')   //我这里是把token存储起来到本地的，可以用别的
  return new Promise((resolve, reject) => {
    wx.request({
      url: baseURL + url,
      method: method,
      data: data,
      header: {
        'token': `${token}`,   //这个地方也不是固定的看你们项目的格式 有的是 Bear XXXXX
        // 'Content-Type': 'application/json', // 根据你的请求需要设置合适的Content-Type
      },
      success: (res) => {
        if (res.statusCode === 200) {
          if (res.data.code === 1000) {    //下面是返回token失效的code，然后这只的重定向
            wx.redirectTo({
              url: '/pages/my/unLogin/index',
            })
            reject('Token Invalid');
          } else {
            resolve(res.data);
          }
        } else {
          reject(res);
        }
      },
      fail: (error) => {
        reject(error);
      },
    });
  });
}

//下面我只写了两种请求方式，这个根据你项目请求方式来添加就好了，东西都是一样的，然后导出就行

async function get(endpoint, data, token) {
  return await request(endpoint, 'GET', data, token);
}

async function post(endpoint, data, token) {
  return await request(endpoint, 'POST', data, token);
}
//这里就是把post和get请求导出  
export default {
  get,
  post,
};

3: 可以在项目任意页面导入，要在js文件导入，下面是在项目里导入使用的方法；是在page上方导入 

4：上述import request 可以替换任意字符 一般写vue都是axios 这里也可以更换的  如果替换了下面使用也需要用你替换的字符来写；

 

小伙伴们学会了吗？其实很简单！