service.ts 5.9 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228
  1. import axios from 'axios';
  2. import { get } from 'lodash-es';
  3. import { ElMessage, ElMessageBox } from 'element-plus';
  4. import type { Action } from 'element-plus';
  5. // @ts-ignore
  6. import { errorLog, errorCreate } from './tools.ts';
  7. // import { env } from "/src/utils/util.env";
  8. // import { useUserStore } from "../store/modules/user";
  9. import { Local, Session } from '/@/utils/storage';
  10. import qs from 'qs';
  11. import { getBaseURL } from './baseUrl';
  12. /**
  13. * @description 创建请求实例
  14. */
  15. function createService() {
  16. // 创建一个 axios 实例
  17. const service = axios.create({
  18. timeout: 20000,
  19. headers: {
  20. 'Content-Type': 'application/json;charset=utf-8',
  21. },
  22. paramsSerializer: {
  23. serialize(params) {
  24. interface paramsObj {
  25. [key: string]: any;
  26. }
  27. let result: paramsObj = {};
  28. for (const [key, value] of Object.entries(params)) {
  29. if (value !== '') {
  30. result[key] = value;
  31. }
  32. if (typeof value === 'boolean') {
  33. result[key] = value ? 'True' : 'False';
  34. }
  35. }
  36. return qs.stringify(result);
  37. },
  38. },
  39. });
  40. // 请求拦截
  41. service.interceptors.request.use(
  42. (config) => config,
  43. (error) => {
  44. // 发送失败
  45. console.log(error);
  46. return Promise.reject(error);
  47. }
  48. );
  49. // 响应拦截
  50. service.interceptors.response.use(
  51. (response) => {
  52. if (response.config.responseType === 'blob') {
  53. return response;
  54. }
  55. // dataAxios 是 axios 返回数据中的 data
  56. const dataAxios = response.data;
  57. // 这个状态码是和后端约定的
  58. const { code } = dataAxios;
  59. // swagger判断
  60. if (dataAxios.swagger != undefined) {
  61. return dataAxios;
  62. }
  63. // 根据 code 进行判断
  64. if (code === undefined) {
  65. // 如果没有 code 代表这不是项目后端开发的接口
  66. errorCreate(`非标准返回:${dataAxios}, ${response.config.url}`, false);
  67. return dataAxios;
  68. } else {
  69. // 有 code 代表这是一个后端接口 可以进行进一步的判断
  70. switch (code) {
  71. case 400:
  72. // Local.clear();
  73. // Session.clear();
  74. errorCreate(`${dataAxios.msg}: ${response.config.url}`);
  75. // window.location.reload();
  76. break;
  77. case 401:
  78. // Local.clear();
  79. Session.clear();
  80. dataAxios.msg = '登录认证失败,请重新登录';
  81. ElMessageBox.alert(dataAxios.msg, '提示', {
  82. confirmButtonText: 'OK',
  83. callback: (action: Action) => {
  84. window.location.reload();
  85. },
  86. });
  87. errorCreate(`${dataAxios.msg}: ${response.config.url}`);
  88. break;
  89. case 2000:
  90. // @ts-ignore
  91. if (response.config.unpack === false) {
  92. //如果不需要解包
  93. return dataAxios;
  94. }
  95. return dataAxios;
  96. case 4000:
  97. errorCreate(`${dataAxios.msg}: ${response.config.url}`);
  98. break;
  99. default:
  100. // 不是正确的 code
  101. errorCreate(`${dataAxios.msg}: ${response.config.url}`);
  102. break;
  103. }
  104. return Promise.reject(dataAxios);
  105. }
  106. },
  107. (error) => {
  108. const status = get(error, 'response.status');
  109. switch (status) {
  110. case 400:
  111. error.message = '请求错误';
  112. break;
  113. case 401:
  114. // Local.clear();
  115. Session.clear();
  116. error.message = '登录授权过期,请重新登录';
  117. ElMessageBox.alert(error.message, '提示', {
  118. confirmButtonText: 'OK',
  119. callback: (action: Action) => {
  120. window.location.reload();
  121. },
  122. });
  123. break;
  124. case 403:
  125. error.message = '拒绝访问';
  126. break;
  127. case 404:
  128. error.message = `请求地址出错: ${error.response.config.url}`;
  129. break;
  130. case 408:
  131. error.message = '请求超时';
  132. break;
  133. case 500:
  134. error.message = '服务器内部错误';
  135. break;
  136. case 501:
  137. error.message = '服务未实现';
  138. break;
  139. case 502:
  140. error.message = '网关错误';
  141. break;
  142. case 503:
  143. error.message = '服务不可用';
  144. break;
  145. case 504:
  146. error.message = '网关超时';
  147. break;
  148. case 505:
  149. error.message = 'HTTP版本不受支持';
  150. break;
  151. default:
  152. break;
  153. }
  154. errorLog(error);
  155. if (status === 401) {
  156. // const userStore = useUserStore();
  157. // userStore.logout();
  158. }
  159. return Promise.reject(error);
  160. }
  161. );
  162. return service;
  163. }
  164. /**
  165. * @description 创建请求方法
  166. * @param {Object} service axios 实例
  167. */
  168. function createRequestFunction(service: any) {
  169. return function (config: any) {
  170. const configDefault = {
  171. headers: {
  172. 'Content-Type': get(config, 'headers.Content-Type', 'application/json'),
  173. },
  174. timeout: 5000,
  175. baseURL: getBaseURL(),
  176. data: {},
  177. };
  178. delete config.headers
  179. // const token = userStore.getToken;
  180. const token = Session.get('token');
  181. if (token != null) {
  182. // @ts-ignore
  183. configDefault.headers.Authorization = 'JWT ' + token;
  184. }
  185. return service(Object.assign(configDefault, config));
  186. };
  187. }
  188. // 用于真实网络请求的实例和请求方法
  189. export const service = createService();
  190. export const request = createRequestFunction(service);
  191. // 用于模拟网络请求的实例和请求方法
  192. export const serviceForMock = createService();
  193. export const requestForMock = createRequestFunction(serviceForMock);
  194. /**
  195. * 下载文件
  196. * @param url
  197. * @param params
  198. * @param method
  199. * @param filename
  200. */
  201. export const downloadFile = function ({ url, params, method, filename = '文件导出' }: any) {
  202. request({
  203. url: url,
  204. method: method,
  205. params: params,
  206. responseType: 'blob'
  207. // headers: {Accept: 'application/vnd.openxmlformats-officedocument'}
  208. }).then((res: any) => {
  209. const xlsxName = window.decodeURI(res.headers['content-disposition'].split('=')[1])
  210. const fileName = xlsxName || `${filename}.xlsx`
  211. if (res) {
  212. const blob = new Blob([res.data], { type: 'charset=utf-8' })
  213. const elink = document.createElement('a')
  214. elink.download = fileName
  215. elink.style.display = 'none'
  216. elink.href = URL.createObjectURL(blob)
  217. document.body.appendChild(elink)
  218. elink.click()
  219. URL.revokeObjectURL(elink.href) // 释放URL 对象0
  220. document.body.removeChild(elink)
  221. }
  222. })
  223. }