自学内容网 自学内容网

HarmonyOS axios 拦截器处理token 及异常

验证用户登录   访问权限控制

需求:

  1. 请求拦截器统一携带 token:开头部分需要拼接 Bearer+空格
  2. 响应拦截器统一处理异常 
  • 400:打印错误信息(登录接口测试)
  • 401:移除用户信息,去登录

import axios, { InternalAxiosRequestConfig, AxiosError, AxiosResponse, AxiosRequestConfig } from '@ohos/axios'
import { promptAction } from '@kit.ArkUI'
import { auth } from './Auth'
import { Logger } from './Logger'

// 增加类型
export interface APIErrorType {
  message: string
  msg: string
  code: string
}

// 实例化 通用配置
const instance = axios.create({
  baseURL: 'https://meikou-api.itheima.net/',
  timeout: 5000
})

// 拦截器配置
// 请求拦截器
// token配置等

instance.interceptors.request.use((config: InternalAxiosRequestConfig) => {
  const user = auth.getUser()
  if (user.token) {
    config.headers['Authorization'] = `Bearer ${user.token}`
  }
  return config
}, (error: AxiosError) => {
  return Promise.reject(error)
})


// 添加响应拦截器
// 错误统一处理等

instance.interceptors.response.use((response: AxiosResponse) => {
  return response
}, (error: AxiosError<APIErrorType>) => {
  if (error.response?.status === 401) {
    promptAction.showToast({ message: '登录过期' })
    // 删除用户信息 去登录页
    auth.removeUser()
    router.pushUrl({
      url: 'pages/LoginPage'
    })
  } else {
    promptAction.showToast({ message: error.response?.data.message })
  }
  return Promise.reject(error)
})


export interface HttpResponse<T> {
  code: string
  msg: string
  result: T
}

export type ResponseType<T> = AxiosResponse<HttpResponse<T>>

// 网络请求封装请求方法
export class RequestAxios {
  static get<T>(url: string, config?: AxiosRequestConfig): Promise<ResponseType<T>> {
    return instance.get<null, ResponseType<T>>(url, config)
  }

  static post<T>(url: string, data?: object): Promise<ResponseType<T>> {
    return instance.post<null, ResponseType<T>>(url, data)
  }

  static delete<T>(url: string, data?: object): Promise<ResponseType<T>> {
    return instance.delete<null, ResponseType<T>>(url, data)
  }

  static put<T>(url: string, data?: object): Promise<ResponseType<T>> {
    return instance.put<null, ResponseType<T>>(url, data)
  }
}


原文地址:https://blog.csdn.net/2301_80345482/article/details/142218833

免责声明:本站文章内容转载自网络资源,如本站内容侵犯了原著者的合法权益,可联系本站删除。更多内容请关注自学内容网(zxcms.com)!