从axios请求捕获错误时重定向

import axios from 'axios';
import { useRouter } from 'vue-router'; // 假设使用 Vue Router 进行路由管理

const apiClient = axios.create({
  baseURL: 'https://api.example.com',
  timeout: 1000,
  headers: {'X-Custom-Header': 'foobar'}
});

const router = useRouter();

// 添加响应拦截器
apiClient.interceptors.response.use(
  response => {
    // 请求成功的情况
    return response;
  },
  error => {
    // 请求失败的情况
    if (error.response) {
      // 请求已发出，但服务器响应的状态码不在 2xx 范围内
      switch (error.response.status) {
        case 401:
          // 未授权，重定向到登录页面
          router.push('/login');
          break;
        case 403:
          // 禁止访问，重定向到无权限页面
          router.push('/no-permission');
          break;
        case 500:
          // 服务器错误，重定向到错误页面
          router.push('/server-error');
          break;
        default:
          // 其他错误处理
          break;
      }
    } else if (error.request) {
      // 请求已发出，但没有收到响应
      console.error('No response received:', error.request);
    } else {
      // 在设置请求时发生了一些事情，触发了错误
      console.error('Error setting up the request:', error.message);
    }
    return Promise.reject(error);
  }
);

// 使用 apiClient 发起请求
apiClient.get('/some-endpoint')
  .then(response => {
    console.log(response.data);
  })
  .catch(error => {
    console.error('Request failed:', error);
  });