request.js 5.1 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180
  1. /**
  2. * Copyright [2022] [https://www.xiaonuo.vip]
  3. * Snowy采用APACHE LICENSE 2.0开源协议,您在使用过程中,需要注意以下几点:
  4. * 1.请不要删除和修改根目录下的LICENSE文件。
  5. * 2.请不要删除和修改Snowy源码头部的版权声明。
  6. * 3.本项目代码可免费商业使用,商业使用请保留源码和相关描述文件的项目出处,作者声明等。
  7. * 4.分发源码时候,请注明软件出处 https://www.xiaonuo.vip
  8. * 5.不可二次分发开源参与同类竞品,如有想法可联系团队xiaonuobase@qq.com商议合作。
  9. * 6.若您的项目无法满足以上几点,需要更多功能代码,获取Snowy商业授权许可,请在官网购买授权,地址为 https://www.xiaonuo.vip
  10. */
  11. // 统一的请求发送
  12. import axios from 'axios'
  13. import qs from 'qs'
  14. import { Modal, message } from 'ant-design-vue'
  15. import sysConfig from '@/config/index'
  16. import tool from '@/utils/tool'
  17. import { convertUrl } from './apiAdaptive'
  18. // 以下这些code需要重新登录
  19. const reloadCodes = [401, 1011007, 1011008]
  20. const errorCodeMap = {
  21. 400: '发出的请求有错误,服务器没有进行新建或修改数据的操作。',
  22. 401: '用户没有权限(令牌、用户名、密码错误)。',
  23. 403: '用户得到授权,但是访问是被禁止的。',
  24. 404: '发出的请求针对的是不存在的记录,服务器没有进行操作。',
  25. 406: '请求的格式不可得。',
  26. 410: '请求的资源被永久删除,且不会再得到的。',
  27. 422: '当创建一个对象时,发生一个验证错误。',
  28. 500: '服务器发生错误,请检查服务器。',
  29. 502: '网关错误。',
  30. 503: '服务不可用,服务器暂时过载或维护。',
  31. 504: '网关超时。'
  32. }
  33. // 定义一个重新登录弹出窗的变量
  34. const loginBack = ref(false)
  35. // 创建 axios 实例
  36. const service = axios.create({
  37. baseURL: '/api', // api base_url
  38. timeout: sysConfig.TIMEOUT // 请求超时时间
  39. })
  40. // HTTP request 拦截器
  41. service.interceptors.request.use(
  42. (config) => {
  43. const token = tool.data.get('TOKEN')
  44. if (token) {
  45. config.headers[sysConfig.TOKEN_NAME] = sysConfig.TOKEN_PREFIX + token
  46. }
  47. if (!sysConfig.REQUEST_CACHE && config.method === 'get') {
  48. config.params = config.params || {}
  49. config.params._ = new Date().getTime()
  50. }
  51. Object.assign(config.headers, sysConfig.HEADERS)
  52. return config
  53. },
  54. (error) => {
  55. return Promise.reject(error)
  56. }
  57. )
  58. // 保持重新登录Modal的唯一性
  59. const error = () => {
  60. loginBack.value = true
  61. Modal.error({
  62. title: '提示:',
  63. okText: '重新登录',
  64. content: '登录已失效, 请重新登录',
  65. onOk: () => {
  66. loginBack.value = false
  67. tool.data.remove('TOKEN')
  68. tool.data.remove('USER_INFO')
  69. tool.data.remove('MENU')
  70. tool.data.remove('PERMISSIONS')
  71. window.location.reload()
  72. }
  73. })
  74. }
  75. // HTTP response 拦截器
  76. service.interceptors.response.use(
  77. (response) => {
  78. // 配置了blob,不处理直接返回文件流
  79. if (response.config.responseType === 'blob') {
  80. if (response.status === 200) {
  81. return response
  82. } else {
  83. message.warning('文件下载失败或此文件不存在')
  84. return
  85. }
  86. }
  87. const data = response.data
  88. const code = data.code
  89. if (reloadCodes.includes(code)) {
  90. if (!loginBack.value) {
  91. error()
  92. }
  93. return
  94. }
  95. if (code !== 200) {
  96. const customErrorMessage = response.config.customErrorMessage
  97. message.error(customErrorMessage || data.msg)
  98. return Promise.reject(data)
  99. // 自定义错误提示,覆盖后端返回的message
  100. // 使用示例:
  101. // export function customerList (data) {
  102. // return request('list', data, 'get', {
  103. // customErrorMessage: '自定义错误消息提示'
  104. // });
  105. // }
  106. } else {
  107. // 统一成功提示
  108. const functionName = response.config.url.split('/').pop()
  109. const apiNameArray = [
  110. 'add',
  111. 'edit',
  112. 'delete',
  113. 'update',
  114. 'grant',
  115. 'reset',
  116. 'stop',
  117. 'pass',
  118. 'disable',
  119. 'enable',
  120. 'revoke',
  121. 'suspend',
  122. 'active',
  123. 'turn',
  124. 'adjust',
  125. 'reject',
  126. 'saveDraft'
  127. ]
  128. apiNameArray.forEach((apiName) => {
  129. // 上面去掉接口路径后,方法内包含内置的进行统一提示成功
  130. if (functionName.includes(apiName)) {
  131. message.success(data.msg)
  132. }
  133. })
  134. }
  135. return Promise.resolve(data.data)
  136. },
  137. (error) => {
  138. if (error) {
  139. const status = 503
  140. const description = errorCodeMap[status]
  141. console.error({
  142. message: '请求错误',
  143. description
  144. })
  145. return Promise.reject(status)
  146. }
  147. }
  148. )
  149. // 适配器, 用于适配不同的请求方式
  150. export const baseRequest = (url, value = {}, method = 'post', options = {}) => {
  151. url = sysConfig.API_URL + convertUrl(url)
  152. if (method === 'post') {
  153. return service.post(url, value, options)
  154. } else if (method === 'get') {
  155. return service.get(url, { params: value, ...options })
  156. } else if (method === 'formdata') {
  157. // form-data表单提交的方式
  158. return service.post(url, qs.stringify(value), {
  159. headers: {
  160. 'Content-Type': 'multipart/form-data'
  161. },
  162. ...options
  163. })
  164. } else {
  165. // 其他请求方式,例如:put、delete
  166. return service({
  167. method: method,
  168. url: url,
  169. data: value,
  170. ...options
  171. })
  172. }
  173. }
  174. export default service