chatGPT：使用axios封装一个通用的底层请求

知识储备：

axios

• Axios 是一个基于 promise 的 HTTP 库，可以用在浏览器和 node.js 中。
• 支持node端和浏览器端
• 支持 Promise
• 丰富的配置项
• 社区支持

正文

好的，以下是使用axios封装一个通用的底层请求的示例代码：

import axios from 'axios';

// 创建axios实例
const request = axios.create({
    
    
  // 请求超时时间
  timeout: 5000,
  // 请求的默认baseURL
  baseURL: process.env.VUE_APP_BASE_API,
});

// 请求拦截器
request.interceptors.request.use(
  (config) => {
    
    
    // 如果有token，则将token放到请求头中
    const token = localStorage.getItem('token');
    if (token) {
    
    
      config.headers.Authorization = `Bearer ${
      
      token}`;
    }
    return config;
  },
  (error) => {
    
    
    console.error(error); // for debug
    return Promise.reject(error);
  }
);

// 响应拦截器
request.interceptors.response.use(
  (response) => {
    
    
    // 如果返回的状态码为200，则说明接口请求成功，可以正常拿到数据
    // 否则的话抛出错误
    const res = response.data;
    if (response.status !== 200) {
    
    
      return Promise.reject(new Error(res.message || 'Error'));
    } else {
    
    
      return res;
    }
  },
  (error) => {
    
    
    console.error('err' + error); // for debug
    return Promise.reject(error);
  }
);

export default request;

使用示例：

import request from '@/utils/request';

// GET请求
export function getData(params) {
    
    
  return request({
    
    
    url: '/data',
    method: 'get',
    params,
  });
}

// POST请求
export function postData(data) {
    
    
  return request({
    
    
    url: '/data',
    method: 'post',
    data,
  });
}

在上面的示例代码中，我们使用axios.create()创建了一个axios实例，然后在请求拦截器中添加了token验证的逻辑，响应拦截器中处理了返回数据的错误情况，最后导出了一个request函数供其他地方使用。使用的时候只需要调用request函数，并传入相关的参数即可。