axios二次封装

在JavaScript中，使用axios进行二次封装通常是为了增加一些通用的功能，比如错误处理、loading状态、请求拦截等。以下是一个简单的axios二次封装示例：

import axios from 'axios';
 
// 创建axios实例
const service = axios.create({
  baseURL: process.env.VUE_APP_BASE_API, // api的base_url
  timeout: 5000 // 请求超时时间
});
 
// 请求拦截器
service.interceptors.request.use(
  config => {
    // 可以在这里添加请求头，例如：'Authorization'
    // if (store.getters.token) {
    //   config.headers['Authorization'] = `Bearer ${store.getters.token}`;
    // }
    return config;
  },
  error => {
    // 请求错误处理
    console.log(error); // for debug
    Promise.reject(error);
  }
);
 
// 响应拦截器
service.interceptors.response.use(
  response => {
    // 可以在这里对响应数据进行处理，例如：对code进行判断
    const res = response.data;
    return res;
  },
  error => {
    // 响应错误处理
    console.log('err' + error); // for debug
    return Promise.reject(error);
  }
);
 
export default service;

在这个例子中，我们创建了一个axios实例，并为这个实例添加了请求拦截器和响应拦截器。在请求拦截器中，我们可以添加一些全局的请求头，例如添加认证token；在响应拦截器中，我们可以对响应的数据进行处理，比如根据返回的状态码进行不同的操作。

使用二次封装后的axios，可以这样发送请求：

import service from '@/utils/request';
 
service.get('/some-path')
  .then(response => {
    console.log(response);
  })
  .catch(error => {
    console.log(error);
  });

这样，你就可以在项目中方便地使用axios进行网络请求，同时拥有一个统一的请求处理和错误处理的地方。