介绍

基于Promise，用于Node.js和浏览器的http库

Api

restFul风格的api

axios.get();
axios.post();
axios.options();
axios.put();
…

axios.create();
axios(config);
axios.all([]);

拦截器

  1. // 请求拦截
  2. axios.interaceptors.request.use(config => {
  3.     let token = localStorage.getItem('token');
  4.     config.header.AuthToken = token;
  5.     return config;
  6. }, err => {
  8. })
  10. // 响应拦截
  11. axios.interaceptors.response.use(response => {
  13.     return response;
  14. }, err => {
  16. })

axios的封装

  • class封装 ```vue

class request { constructor() { this.config = { baseURL: ‘https://forguo.cn‘, timeout: 10000, }; }

  1. request(options) {
  2.     const config = Object.assign({}, this.config, options);
  3.     const instance = axios.create();
  4.     this.setInterceptors(instance);
  5.     return instance(config); // 返回axios实例的执行结果
  6. }
  8. setInterceptors(instance) {
  9.     instance.interceptors.request.use((config) => {
  10.         return config;
  11.     }, err => {
  12.         return Promise.reject(err);
  13.     });
  14.     instance.interceptors.response.use((data) => {
  15.         return Promise.resolve(data.data);
  16.     }, (err) => {
  17.         return Promise.resolve(err);
  18.     })
  19. }

}

  2. - axios实例
  3. ```vue
  4. // 创建一个 axios 实例
  5. const request = axios.create({
  6.     baseURL: Setting.apiBaseURL,
  7.     timeout: 60000 // 请求超时时间
  8. });
  10. // 拦截器
  11. request.interceptors.request.use(config => {}, err => {});
  13. request.interceptors.response.use(response => {}, err => {});