vue3封装axios并使用拦截器处理错误

utils/http.js

import axios from "axios";

const http = axios.create({
  withCredentials: false,
  timeout: 30000,
  baseURL: "http://127.0.0.1:8000",
  headers: {
    Accept: "application/json",
  },
});

http.interceptors.request.use(
  function (config) {
    return config;
  },
  function (error) {
    return Promise.reject(error);
  }
);

http.interceptors.response.use(
  function (response) {
    return response;
  },
  function (error) {
    const message = error.message || {};
    if (message) alert(message);
    return Promise.reject(message);
  }
);

export default http;

 使用

<script setup>
import http from "../utils/http.js";
http.get("/login").then(function (response) {
  console.log(response);
});
</script>
<template>
  <div class="about">
    <h1>This is home page</h1>
  </div>
</template>