axios封装request配置

plan_ b

于 2021-11-11 12:48:25 发布

阅读量960

点赞数

CC 4.0 BY-SA版权

分类专栏： vue框架学习和项目常见问题文章标签： vue.js javascript ecmascript

本文链接：https://blog.csdn.net/plan_jok/article/details/121265602

vue框架学习和项目常见问题专栏收录该内容

23 篇文章

订阅专栏

本文介绍了如何在Vue.js项目中对axios进行封装，以统一管理HTTP请求配置，包括错误处理、请求拦截、响应拦截等，提升代码复用性和可维护性。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

import axios from 'axios'
import Qs from 'qs'

//axios的get方法中使用params时对于js数组类型的参数的默认操作比较诡异，会使得参数名后带上'[]'字符串，可以使用qs自带的 arrayFormat 参数配置解决这个问题

export function request(config) {
  const service = axios.create({
    headers: {'content-type': 'application/json'},
    // baseURL: process.env.Vue,
    // baseURL: 'https://api.apiopen.top/',  // url = base url + request url
    // baseURL: 'http://127.0.0.1:5000/',
    timeout: 60000,
    withCredentials: false,
    paramsSerializer: params => {
      return Qs.stringify(params, {arrayFormat: 'repeat'})
    }
  })
  return service(config)
}