axios 的封装
在使用 axiso 的过程中,为保证 解耦,需要对 axios 进行封装,在封装后的类中使用,直接引用 request1 即可:
具体代码如下:
// 对第三方框架进行封装
import axios from 'axios'
export function request1(config, success, failure) {
// 1.创建axios 实例
const instance = axios.create({
baseURL: "http://localhost:5000",
timeout: 40000 // 超时时间
});
// 2.axios 拦截器
// 2.1 请求拦截
instance.interceptors.request.use(config => {
console.log('请求成功拦截器');
console.log(config);
return (config);
},
// 失败的拦截,一般是发送不到的
err => {
console.log('请求失败拦截器');
console.log(err);
});
// 2.2 响应拦截
// instance.interceptors.response.use(res => {
// console.log('响应拦截成功');
// console.log(res);
// return (res);
// }, error => {
// console.log('相应拦截错误');
// console.log(error);
// return (error);
// if (error && error.response) {
// switch (error.response.status) {
// case 400:
// error.message = '错误请求';
// Toast('错误请求');
// break
// case 401:
// error.message = '未授权,请重新登录';
// Toast('未授权,请重新登录');
// break
// case 403:
// error.message = '拒绝访问';
// Toast('拒绝访问');
// break
// case 404:
// error.message = '请求错误,未找到该资源';
// Toast('请求错误,未找到该资源');
// break
// case 405:
// error.message = '请求方法未允许';
// Toast('请求方法未允许');
// break
// case 408:
// error.message = '请求超时';
// Toast('请求超时');
// break
// case 500:
// error.message = '服务器端出错';
// Toast('服务器端出错');
// break
// case 501:
// error.message = '网络未实现';
// Toast('网络未实现');
// break
// case 502:
// error.message = '网络错误';
// Toast('网络错误');
// break
// case 503:
// error.message = '服务不可用';
// Toast('服务不可用');
// break
// case 504:
// error.message = '网络超时';
// Toast('网络超时');
// break
// case 505:
// error.message = 'http版本不支持该请求';
// Toast('http版本不支持该请求');
// break
// default:
// error.message = `连接错误${error.response.status}`;
// Toast(`'连接错误'${error.response.status}`);
// }
// } else {
// error.message = "连接到服务器失败";
// Toast('连接到服务器失败');
// }
// return Promise.reject(error.message)
// });
// 3.对实例进行配置
instance(config)
.then(res => {
success(res)
})
.catch(err => {
console.log(err);
failure(err)
})
}
引用:
import {request1} from '../network/request'