vue集成axios

1 下载依赖

npm install axios

2 设置请求路径

// 创建一个axios.js文件

import axios from 'axios'

// 基本配置
const request = axios.create({
  baseURL: 'http://localhost:8081/', // 根据实际情况修改API地址
  timeout: 5000 // 设置超时时间，单位为ms
})
 
// 请求拦截器：对请求配置进行统一处理
request.interceptors.request.use(config => {
  // 可以在这里根据业务需求添加统一的请求头、参数等
  // 例如添加token
  // config.headers['Authorization'] = 'Bearer ' + getToken();
  return config;
}, error => {
  // 请求错误处理
  return Promise.reject(error);
});
 
// 响应拦截器：对响应结果进行统一处理
request.interceptors.response.use(response => {
  // 对响应数据做处理，例如只返回data部分
  return response.data;
}, error => {
  if (error.code === 'ECONNABORTED' && error.message.indexOf('timeout') !== -1) {
    // 超时统一处理，可以根据需要进行错误提示或重新请求
    console.error('请求超时，请检查网络连接！');
    // 可以在这里进行重试请求的逻辑处理
  }
  return Promise.reject(error);
});

export default request

3 编写具体的接口方法

// 创建user.js文件

import request from '../plugins/axios'

export function getUser () {
  return request({
    url: '/user/all',
    method: 'get'
  })
}

4 具体页面引用