创建实例模板
//创建一个请求实例
let instance = axios.create({})
//为请求实例添加请求拦截器
instance.interceptors.request.use(
config =>{
return config
},err =>{
//请求错误 一般http状态码以4开头,常见:401超时,404 not found 多为前端浏览器错误
return Promise.reject(err)
}
)
instance.interceptors.response.use(
res=>{
return res
},err =>{
//响应错误,一般http状态码以5开头,500系统错误,502系统重启等,偏向于服务端返回的报错
return Promise.reject(err)
}
)
//使用
instance.get('data').then(res=>{
console.log(res)
}).catch(err =>{
console.log(err)
})
export default instance
项目实战案例
import axios from "axios";
//引入进度条(必须引入nprogress.css的样式)
import Nprogress from 'nprogress'
import 'nprogress/nprogress.css'
//创建axios实例对象
const instance = axios.create({
baseURL:"http://localhost:8080/home", //接口地址仅供参考
timeout:5000
})
//axios请求拦截器
instance.interceptors.request.use((config) =>{
Nprogress.start()
return config;
},error => {
Nprogress.done()
return Promise.reject(error)
})
//axios响应拦截器
instance.interceptors.response.use((res) =>{
Nprogress.done()
console.log(res.data)
return res.data;
},error => {
Nprogress.done()
return Promise.reject(error)
})
export default instance