封装axios请求接口

封装 Axios 请求接口通常是为了简化 JavaScript 应用程序中对 HTTP 请求的操作，使其更加模块化和易于维护。下面是基本步骤：

1. 引入 Axios 库：首先需要安装 Axios，它是基于 Promise 的 HTTP 客户端库，可以在 Node.js 和浏览器环境中使用。在项目中添加依赖：

npm install axios
# 或者如果在 Webpack 中
import 'axios/dist/axios.min.css';

2. 创建一个 Axios 实例：你可以创建一个全局的 Axios 实例，这样所有的请求都共享相同的配置。

const axios = require('axios');
const instance = axios.create({
  baseURL: 'https://api.example.com', // API 基础URL
  timeout: 5000, // 设置超时时间（毫秒）
  headers: {'X-Custom-Header': 'value'}, // 添加默认请求头
});

3. 函数式封装：定义一系列用于特定操作的方法，比如发送 GET、POST、PUT、DELETE 等请求。

function get(url) {
  return instance.get(url);
}

function post(url, data) {
  return instance.post(url, data);
}

function put(url, data) {
  return instance.put(url, data);
}

function del(url) {
  return instance.delete(url);
}

4. 返回 Promise：每个方法都应该返回一个 Promise，处理响应结果或错误。

function get(url) {
  return instance.get(url)
    .then(response => response.data)
    .catch(error => handleErrors(error));
}

// 示例错误处理函数
function handleErrors(error) {
  if (error.response) {
    console.error(`Error ${error.response.status}: ${error.response.statusText}`);
  } else {
    console.error('Error in request', error.message);
  }
}