ES6封装axios

简单的接口封装方便查阅，以下是自己记录：
1.接口的配置端
/ 配置文件 /
_const httpURL = {
// 开发环境接口地址
_baseUrl: ‘https://new-zyb.schoolpi.net‘,
}

export default {
_//开发环境
_requestURL: httpURL.baseUrl,
}
2.封装axios部分，在这里使用了class类做封装
import axios from ‘axios’;
import baseUrl from ‘../http/baseUrl’

export class NewAxios {
constructor() {
this.baseURL = baseUrl.requestURL;
this.timeout = 10000;
this.withCredentials = true;
}

setInterceptors = (instance) => {
instance.interceptors.request.use(
(config)=>{
let token = window.sessionStorage.getItem(‘token’)
if (token) {
config.headers.Authorization= token;// 让每个请求携带自定义token 请根据实际情况自行修改
}
return config
},error => {
// console.log(error)
});

instance.interceptors.response.use(<br />      (response)=>{<br />        _// console.log(response)<br />        _return response;
  },<br />      (error) => {<br />        let errMsg = '';<br />        if (error && error.response.status) {<br />          switch (error.response.status) {<br />            case 401:<br />              errMsg = '登录状态失效，请重新登录';<br />              break;<br />            case 403:<br />              errMsg = '拒绝访问';<br />              break;<br />            case 408:<br />              errMsg = '请求超时';<br />              break;<br />            case 500:<br />              errMsg = '服务器内部错误';<br />              break;<br />            case 501:<br />              errMsg = '服务未实现';<br />              break;<br />            case 502:<br />              errMsg = '网关错误';<br />              break;<br />            case 503:<br />              errMsg = '服务不可用';<br />              break;<br />            case 504:<br />              errMsg = '网关超时';<br />              break;<br />            case 505:<br />              errMsg = 'HTTP版本不受支持';<br />              break;<br />            default:<br />              break;<br />          }<br />        } else {<br />          errMsg = error;<br />        }<br />        return Promise.reject(errMsg);<br />      }<br />    )<br />  }

request() {
// 创建axios实例
_axios.defaults.headers[‘Content-Type’] =’application/x-www-form-urlencoded’;
//实例化
_const instance = axios.create({
baseURL:this.baseURL,
timeout:this.timeout,
});

_// // 配置拦截器，支持根据不同url配置不同的拦截器。<br />    _this._setInterceptors_(instance);
return instance;

}
}

3.单独页面调用axios封装
import {NewAxios} from ‘../until/request/request’
import {baseApi} from ‘./baseApi’

export class loginView extends NewAxios{
//构造函数
_constructor(props) {
super(props);
this.until = this.request()
}
//登录
loginData(params){
return this.until({
url:baseApi.login,
method:’POST’,
data:params
// params:params
_})
}
}
4.在使用页面调用封装接口
import {loginView} from “../../config/loginView”;
const {data:res} = await (new loginView().loginData(formdata))