关于axios的二次封装
@1 第一步 我们一般都会先导入axios
import axios from ‘axios’
@2 第二步 创建axios的实例 可以同时创建多个实例 每个实例配置不同
const http = axios.create( {
// 这里面可以做一些基础的配置 比如基础路径 ，axios 请求超时的时间
baseURL:'https://www.baidu.com'，
timeout：60000
})
@3 只针对post请求，请求主体做格式化的处理，安装后台的要求，如果不设置transfromRequest
会把Data对象转化为JSON字符串传递给服务器， axios内部会识别常用的数据格式，自动设
置请求头中的Content-Type
http.defaults.transfromRequest = data =>{
if(typeof data === 'object') qs.stringfy(data) // qs.stringfy是转化为name='zs'$age=12
return data
}
http.default.validateStatus = status = > {
return status >= 200 && status < 400 // 设置状态码在200到400之间都是成功的
}
@4 设置请求拦截器 并且携带token
http.interceptors.request.use(config=>{
if(localstorags.getItem('token')){
config.headers.authorzation = localstorage.getItem('token')
}
return config
})
@5 设置响应拦截器
http.intercepotrs.response.use(responst=>{
return responst.data
}, reson=>{
// 请求失败的处理
let status = reson?.reponse.status
code = reson?.code
if(status){
// 服务器返回的有结果 没有经过validateStatus状态码的校验
switch（+status）{
case 404:
alert('请求地址不存在')
break；
case 500:
alert('服务器发生未知错误')
break；
。。。
}
}else if（code==='ECONNABORTED'）{
// 请求超时
alert（‘当前请求超时’）
}else if（axios.isCancel(reson)）{
// 请求中断
alert（'请求中断'）
}else {
alert（‘网络中断，请检查网络'）
}
return Promise.reject(reson)
})
@ 6 记得导出
export default http