通用axios封装代码及token处理

最新推荐文章于 2023-01-14 11:40:40 发布

捧鲜花的唐老鸭

最新推荐文章于 2023-01-14 11:40:40 发布

阅读量249

点赞数

文章标签：前端 javascript react

本文链接：https://blog.csdn.net/weixin_58207509/article/details/121709336

版权

本文介绍了如何使用axios创建HTTP客户端，配置了全局的请求和响应拦截器，以便在发送和接收数据时添加身份验证和错误处理。通过getToken函数获取token并将其添加到请求头，确保API调用的安全性。

摘要由CSDN通过智能技术生成

// 封装axios
import axios from 'axios'
import { getToken } from './storage'

const http = axios.create({
  baseURL: 'http://geek.itheima.net/v1_0/',
  timeout: 5000
})

// 添加请求拦截器
http.interceptors.request.use(
  function (config) {
    // 在发送请求之前做些什么
    if (getToken()) {
      config.headers!.Authorization = 'Bearer ' + getToken().token
    }
    return config
  },
  function (error) {
    // 对请求错误做些什么
    return Promise.reject(error)
  }
)

// 添加响应拦截器
http.interceptors.response.use(
  function (response) {
    // 对响应数据做点什么
    return response
  },
  function (error) {
    // 对响应错误做点什么
    return Promise.reject(error)
  }
)

export default http