api.js 3.8 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119
  1. import axios from "axios";
  2. import { ElLoading, ElMessage } from "element-plus";
  3. import router from "@/router";
  4. let token = (localStorage && localStorage.getItem('token')) || 'eyJhbGciOiJIUzI1NiJ9.eyJzdWIiOiIxNTkxNTgxNjA0MSIsImxvZ2luVHlwZSI6InVzZXIiLCJ1c2VyTmFtZSI6IjE1OTE1ODE2MDQxIiwiaWF0IjoxNjgxODAzNzY1LCJqdGkiOiJhMDU4M2EwZS01M2EzLTQ1YTUtOTI1ZS1kZDgzYzU5Y2Y5MGMifQ.bdu5jqbSxSlo9LH4w_uPEuP67DUJk6w5Yqnu633OtQI'
  5. // request是一个axios实例,每一个实例你都可以单独定制它的baseURL,超时时间,请求头和一些其他配置项。
  6. const baseUrl = import.meta.env.VITE_BASE_URL; //接口统一域名
  7. const instance = axios.create({
  8. baseURL: baseUrl,
  9. timeout: 60 * 1000, //设置超时
  10. headers: {
  11. "Content-Type": "application/json;charset=UTF-8;",
  12. "Accept-Language": "zh-CN,zh;q=0.9,en;q=0.8",
  13. ".AspNetCore.Culture": "c=zh-Hans|uic=zh-Hans",
  14. token:token,
  15. },
  16. });
  17. let loading;
  18. //正在请求的数量
  19. let requestCount = 0;
  20. //显示loading
  21. const showLoading = () => {
  22. if (requestCount === 0) {
  23. loading = ElLoading.service({
  24. fullscreen: true,
  25. text: "Loading ",
  26. background: "rgba(0, 0, 0, 0.7)",
  27. });
  28. }
  29. requestCount++;
  30. };
  31. //隐藏loading
  32. const hideLoading = () => {
  33. requestCount--;
  34. if (requestCount == 0) {
  35. loading.close();
  36. }
  37. };
  38. //请求拦截器
  39. instance.interceptors.request.use(
  40. (config) => {
  41. console.log('config',config.loading,'if',config.loading != true)
  42. if(!config.loading){
  43. showLoading();
  44. }
  45. // 每次发送请求之前判断是否存在token,如果存在,则统一在http请求的header都加上token,不用每次请求都手动添加了
  46. //若请求方式为post,则将data参数转为JSON字符串
  47. if (config.method === "POST") {
  48. config.data = JSON.stringify(config.data);
  49. }
  50. return config;
  51. },
  52. (error) =>
  53. // 对请求错误做些什么
  54. Promise.reject(error)
  55. );
  56. //响应拦截器
  57. instance.interceptors.response.use(
  58. (response) => {
  59. hideLoading();
  60. if (response.data.code !== 200) {
  61. ElMessage.error(response.data.message);
  62. return Promise.reject(response.data)
  63. // router.push("/");
  64. }
  65. else return response.data?.data;
  66. },
  67. (error) => {
  68. hideLoading();
  69. //响应错误
  70. let message = "";
  71. if (error.response && error.response.status) {
  72. const status = error.response.status;
  73. console.log('Error',error.response)
  74. switch (status) {
  75. case 400:
  76. message = "请求错误";
  77. break;
  78. case 401:
  79. message = "请求错误";
  80. break;
  81. case 404:
  82. message = "请求地址出错";
  83. break;
  84. case 408:
  85. message = "请求超时";
  86. break;
  87. case 500:
  88. message = "服务器内部错误!";
  89. break;
  90. case 501:
  91. message = "服务未实现!";
  92. break;
  93. case 502:
  94. message = "网关错误!";
  95. break;
  96. case 503:
  97. message = "服务不可用!";
  98. break;
  99. case 504:
  100. message = "网关超时!";
  101. break;
  102. case 505:
  103. message = "HTTP版本不受支持";
  104. break;
  105. default:
  106. message = "请求失败";
  107. }
  108. ElMessage.error(message);
  109. return Promise.reject(error);
  110. }
  111. return Promise.reject(error);
  112. }
  113. );
  114. export default instance;