TALL-MUI-4/utils/request.js

import store from '@/store/index.js';
import storage from '@/utils/storage.js';
import ui from '@/utils/ui.js';

export function setupHttp(app) {
  app.config.globalProperties.$u.http.setConfig({
    baseUrl: '',
    showLoading: true, // 是否显示请求中的loading
    loadingText: '玩命加载中...',
    loadingTime: 800,
    loadingMask: true, // 展示loading的时候，是否给一个透明的蒙层，防止触摸穿透
    // 配置请求头信息
    header: {
      'content-type': 'application/json;charset=UTF-8'
    },
  });

  // 请求拦截部分，如配置，每次请求前都会执行
  app.config.globalProperties.$u.http.interceptor.request = config => {
    if (store.state.count === 0) {
      return false;
    }

    const token = store.state.user.token || storage.getStorageSync('anyringToken');
    if (token) {
      config.header.Authorization = `Bearer ${token}`;
    }

    config.header.deviceId = store.state.systemInfo.deviceId;
    // #ifdef APP-PLUS
    config.header.appType = 1;
    // #endif
    // #ifdef H5
    config.header.appType = 0;
    // #endif
    return config;
  };

  // 响应拦截，如配置，每次请求结束都会执行本方法
  app.config.globalProperties.$u.http.interceptor.response = async res => {
    // res为服务端返回值，可能有code，result等字段
    // 这里对res.result进行返回，将会在this.$u.post(url).then(res => {})的then回调中的res的到
    // 如果配置了originalData为true，请留意这里的返回值
    if (res.code === 200) {
      if (res.tokenObj && res.tokenObj.token) {
        store.commit('user/setToken', res.tokenObj.token);
        storage.setStorageSync('anyringToken', res.tokenObj.token || '');
        storage.setStorageSync('refreshToken', res.tokenObj.refreshToken || '');
      }
      return res.data;
    } else if (res.code === 400) { // deviceId为空
      ui.showToast(res.msg);
      return false;
    } else if (res.code === 49) { // token过期
      store.commit('setCount', store.state.count - 1);
      return 49;
    } else if (res.code === 401) { // refreshToken过期
      // 假设201为token失效，这里跳转登录
      // ui.showToast('验证失败，请重新登录');
      ui.showToast(res.msg);

      storage.setStorageSync('anyringToken', '');
      storage.setStorageSync('refreshToken', '');
      store.commit('user/setToken', ' ');

      setTimeout(() => {
        // 此为uView的方法，详见路由相关文档
        uni.navigateTo({
          url: '/pages/user/login'
        })
      }, 1500);
      return false;
    } else {
      // 如果返回false，则会调用Promise的reject回调，
      // 并将进入this.$u.post(url).then().catch(res=>{})的catch回调中，res为服务端的返回值
      return false;
    }
  };

  app.config.globalProperties.$u.post = async (url, param = {}, header = {}) => {
    let res = await app.config.globalProperties.$u.http.request({
      url,
      method: 'POST',
      header,
      data: {
        param
      },
    });
    if (res === 49) {
      const refreshToken = storage.getStorageSync('refreshToken');
      await store.dispatch('user/getTokenByRefreshToken', refreshToken);
      res = await app.config.globalProperties.$u.http.request({
        url,
        method: 'POST',
        header,
        data: {
          param
        },
      });

      if (res.code === 200) {
        store.commit('setCount', 3);
      }

      return res;
    }
    return res;
  };

  app.config.globalProperties.$u.get = async (url, param = {}, header = {}) => {
    let res = await app.config.globalProperties.$u.http.request({
      url,
      method: 'GET',
      header,
      data: {
        param
      },
    });
    if (res === 49) {
      const refreshToken = storage.getStorageSync('refreshToken');
      await store.dispatch('user/getTokenByRefreshToken', refreshToken);
      res = await app.config.globalProperties.$u.http.request({
        url,
        method: 'GET',
        header,
        data: {
          param
        },
      });

      if (res.code === 200) {
        store.commit('setCount', 3);
      }

      return res;
    }
    return res;
  };
}