request.js 5.8 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154
  1. import axios from 'axios'
  2. import { ElNotification , ElMessageBox, ElMessage, ElLoading } from 'element-plus'
  3. import { getToken } from '@/utils/auth'
  4. import errorCode from '@/utils/errorCode'
  5. import { tansParams, blobValidate } from '@/utils/goldenwater'
  6. import cache from '@/plugins/cache'
  7. import { saveAs } from 'file-saver'
  8. import useUserStore from '@/store/modules/user'
  9. import { Base64 } from 'js-base64'
  10. let downloadLoadingInstance
  11. // 是否显示重新登录
  12. export let isRelogin = { show: false }
  13. axios.defaults.headers['Content-Type'] = 'application/json;charset=utf-8'
  14. // 创建axios实例
  15. const service = axios.create({
  16. // axios中请求配置有baseURL选项,表示请求URL公共部分
  17. baseURL: import.meta.env.VITE_SERVICE_BASE_TITLE,
  18. // 超时
  19. timeout: 10000
  20. })
  21. // request拦截器
  22. service.interceptors.request.use(config => {
  23. // 是否需要设置 token
  24. const isToken = (config.headers || {}).isToken === false
  25. // 是否需要防止数据重复提交
  26. const isRepeatSubmit = (config.headers || {}).repeatSubmit === false
  27. // 间隔时间(ms),小于此时间视为重复提交
  28. const interval = (config.headers || {}).interval || 1000
  29. if (getToken() && !isToken) {
  30. config.headers['Authorization'] = 'Bearer ' + getToken() // 让每个请求携带自定义token 请根据实际情况自行修改
  31. }
  32. // get请求映射params参数
  33. if (config.method === 'get' && config.params) {
  34. let url = config.url + '?' + tansParams(config.params)
  35. url = url.slice(0, -1)
  36. config.params = {}
  37. config.url = url
  38. }
  39. if (!isRepeatSubmit && (config.method === 'post' || config.method === 'put')) {
  40. const requestObj = {
  41. url: config.url,
  42. data: typeof config.data === 'object' ? JSON.stringify(config.data) : config.data,
  43. time: new Date().getTime()
  44. }
  45. const requestSize = Object.keys(JSON.stringify(requestObj)).length // 请求数据大小
  46. const limitSize = 5 * 1024 * 1024 // 限制存放数据5M
  47. if (requestSize >= limitSize) {
  48. console.warn(`[${config.url}]: ` + '请求数据大小超出允许的5M限制,无法进行防重复提交验证。')
  49. return config
  50. }
  51. const sessionObj = cache.session.getJSON('sessionObj')
  52. if (sessionObj === undefined || sessionObj === null || sessionObj === '') {
  53. cache.session.setJSON('sessionObj', requestObj)
  54. } else {
  55. const s_url = sessionObj.url // 请求地址
  56. const s_data = sessionObj.data // 请求数据
  57. const s_time = sessionObj.time // 请求时间
  58. if (s_data === requestObj.data && requestObj.time - s_time < interval && s_url === requestObj.url) {
  59. const message = '数据正在处理,请勿重复提交'
  60. console.warn(`[${s_url}]: ` + message)
  61. return Promise.reject(new Error(message))
  62. } else {
  63. cache.session.setJSON('sessionObj', requestObj)
  64. }
  65. }
  66. }
  67. return config
  68. }, error => {
  69. console.log(error)
  70. Promise.reject(error)
  71. })
  72. // 响应拦截器
  73. service.interceptors.response.use(res => {
  74. // 未设置状态码则默认成功状态
  75. const code = res.data.code || 200
  76. // 获取错误信息
  77. const msg = errorCode[code] || res.data.msg || errorCode['default']
  78. // 二进制数据则直接返回
  79. if (res.request.responseType === 'blob' || res.request.responseType === 'arraybuffer') {
  80. return res.data
  81. }
  82. if (code === 401) {
  83. if (!isRelogin.show) {
  84. isRelogin.show = true
  85. ElMessageBox.confirm('登录状态已过期,您可以继续留在该页面,或者重新登录', '系统提示', { confirmButtonText: '重新登录', cancelButtonText: '取消', type: 'warning' }).then(() => {
  86. isRelogin.show = false
  87. useUserStore().logOut().then(() => {
  88. location.href = '/index'
  89. })
  90. }).catch(() => {
  91. isRelogin.show = false
  92. })
  93. }
  94. return Promise.reject('无效的会话,或者会话已过期,请重新登录。')
  95. } else if (code === 500) {
  96. ElMessage({ message: msg, type: 'error' })
  97. return Promise.reject(new Error(msg))
  98. } else if (code === 601) {
  99. ElMessage({ message: msg, type: 'warning' })
  100. return Promise.reject(new Error(msg))
  101. } else if (code !== 200) {
  102. ElNotification.error({ title: msg })
  103. return Promise.reject('error')
  104. } else {
  105. return Promise.resolve(res.data)
  106. }
  107. },
  108. error => {
  109. console.log('err' + error)
  110. let { message } = error
  111. if (message == "Network Error") {
  112. message = "后端接口连接异常"
  113. } else if (message.includes("timeout")) {
  114. message = "系统接口请求超时"
  115. } else if (message.includes("Request failed with status code")) {
  116. message = "系统接口" + message.slice(-3) + "异常"
  117. }
  118. ElMessage({ message: message, type: 'error', duration: 5 * 1000 })
  119. return Promise.reject(error)
  120. }
  121. )
  122. // 通用下载方法
  123. export function download(url, params, filename, config) {
  124. downloadLoadingInstance = ElLoading.service({ text: "正在下载数据,请稍候", background: "rgba(0, 0, 0, 0.7)", })
  125. return service.post(url, params, {
  126. transformRequest: [(params) => { return tansParams(params) }],
  127. headers: { 'Content-Type': 'application/x-www-form-urlencoded' },
  128. responseType: 'blob',
  129. ...config
  130. }).then(async (data) => {
  131. const isBlob = blobValidate(data)
  132. if (isBlob) {
  133. const blob = new Blob([data])
  134. saveAs(blob, filename)
  135. } else {
  136. const resText = await data.text()
  137. const rspObj = JSON.parse(resText)
  138. const errMsg = errorCode[rspObj.code] || rspObj.msg || errorCode['default']
  139. ElMessage.error(errMsg)
  140. }
  141. downloadLoadingInstance.close()
  142. }).catch((r) => {
  143. console.error(r)
  144. ElMessage.error('下载文件出现错误,请联系管理员!')
  145. downloadLoadingInstance.close()
  146. })
  147. }
  148. export default service