axios的二次封装

皮皮小呆瓜呀

于 2023-03-06 23:40:27 发布

阅读量109

点赞数

文章标签： javascript 前端 vue.js

本文链接：https://blog.youkuaiyun.com/weixin_74374956/article/details/129373289

版权

该文介绍了如何在项目中引入axios库，设置基础URL、请求超时时间，并添加请求与响应拦截器来处理token。它演示了在util工具包下创建一个名为request.js的文件，用于封装axios的配置和拦截器。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

1、下载axios依赖包:npm i axios

2、在util工具包下创建request.js工具包

//导入axios
import axios from 'axios'

//设置基础路径
axios.default.baseURL = 'http://www.zhajizhe.cn:3005'

//设置请求超时
axios.default.timeout = 5000

//设置请求拦截器
axios.interceptors.request.use(config=>{
      //可以设置携带token信息
      config.headers.Authorization = localStorage.getItem('token')
      return config
}.err=>{
      return Promise.reject(err)
})
//设置响应拦截器
axios.interceptors.response.use(response=>{
      return response
},err=>{
      return Promise.reject(err)
})

export default axios