UniApp 请求拦截器和响应拦截器使用教程

在 UniApp 中，可以通过在 main.js 中使用 uni.interceptors 的方式来使用请求拦截器和响应拦截器。

请求拦截器用于在发送请求前对请求进行处理，例如添加请求头、对请求参数进行加密等。响应拦截器用于在获取到服务器返回的数据后对数据进行处理，例如对返回的数据进行解密、统一处理错误信息等。

下面是使用请求拦截器和响应拦截器的示例代码：

// main.js

import Vue from 'vue'
import App from './App'
import store from './store'

Vue.config.productionTip = false

// 全局注册请求拦截器
uni.interceptors.request.use((config) => {
  // 在发送请求之前做些什么
  config.headers['Authorization'] = getToken() // 设置请求头的 Authorization 字段
  return config
}, (error) => {
  // 对请求错误做些什么
  return Promise.reject(error)
})

// 全局注册响应拦截器
uni.interceptors.response.use((response) => {
  // 对响应数据做些什么
  if (response.data.code === 401) {
    // 处理未登录状态的响应
    redirectToLogin()
  }
  return response
}, (error) => {
  // 对响应错误做些什么
  return Promise.reject(error)
})

App.mpType = 'app'

const app = new Vue({
  store,
  ...App
})
app.$mount()