upload.js 4.4 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141
  1. /*
  2. * @Description: 统一上传工具,先获取uploadToken,再上传到新接口
  3. * @Author: Auto
  4. * @Date: 2024-01-01
  5. */
  6. // import axios from 'axios'
  7. // import Config from '../config'
  8. import axios from './axios.min.js'
  9. let hostParts = window.location.host.split('.');
  10. let tld = hostParts.slice(2).join('.') || 'com';
  11. let ho = window.location.host.split('.')[1];
  12. let host80 = 'https://secure.' + ho + '.' + tld;
  13. let host05 = 'https://file.' + ho + '.com';
  14. /**
  15. * 统一上传方法
  16. * @param {File} file - 要上传的文件
  17. * @param {String} originalUrl - 原上传接口URL(用于获取uploadToken)
  18. * @param {Object} headers - 请求头
  19. * @param {Function} onProgress - 上传进度回调
  20. * @returns {Promise} 上传结果
  21. */
  22. export async function unifiedUpload(file, originalUrl, headers = {}, onProgress = null) {
  23. try {
  24. // 第一步:调用原接口获取 uploadToken
  25. const formData = new FormData()
  26. formData.append('file', file)
  27. // 设置请求头
  28. const requestHeaders = {
  29. 'Access-Token': sessionStorage.getItem("access_token") || '',
  30. 'Language': sessionStorage.getItem("lang") || '',
  31. 'CLIENT': sessionStorage.getItem("CLIENT") || '',
  32. ...headers
  33. }
  34. // 获取基础URL
  35. let baseURL = host80
  36. // 提取原接口路径
  37. let originalPath = originalUrl
  38. if (originalUrl.startsWith('http://') || originalUrl.startsWith('https://')) {
  39. // 完整URL,提取路径部分
  40. const urlObj = new URL(originalUrl)
  41. originalPath = urlObj.pathname
  42. }
  43. // 调用原接口获取 uploadToken(先不传文件,只获取token)
  44. // 如果原接口需要文件才能返回token,则传文件
  45. const tokenFormData = new FormData()
  46. tokenFormData.append('file', file)
  47. const tokenResponse = await axios.post(originalPath, tokenFormData, {
  48. baseURL: baseURL,
  49. headers: requestHeaders,
  50. timeout: 30000,
  51. onUploadProgress: (progressEvent) => {
  52. if (onProgress && progressEvent.total) {
  53. const percent = Math.round((progressEvent.loaded * 100) / progressEvent.total)
  54. onProgress({ percent })
  55. }
  56. }
  57. })
  58. // 从原接口响应中获取 uploadToken
  59. // 假设原接口返回格式为 { code: 200, data: { uploadToken: 'xxx', ... } } 或 { code: 200, uploadToken: 'xxx' }
  60. // let uploadToken = null
  61. // if (tokenResponse.data.code == 200) {
  62. // if (tokenResponse.data.data.path) {
  63. // // 如果直接返回 uploadToken
  64. // uploadToken = tokenResponse.data.data.path
  65. // }
  66. // }
  67. // if (!uploadToken) {
  68. // throw new Error('Failed to get uploadToken from original upload interface')
  69. // }
  70. // // 第二步:使用新接口上传文件
  71. // const uploadFormData = new FormData()
  72. // uploadFormData.append('file', file)
  73. // uploadFormData.append('uploadToken', uploadToken)
  74. // const uploadResponse = await axios.post('/common/base/upload', uploadFormData, {
  75. // baseURL: host05,
  76. // headers: requestHeaders,
  77. // timeout: 60000,
  78. // onUploadProgress: (progressEvent) => {
  79. // if (onProgress && progressEvent.total) {
  80. // const percent = Math.round((progressEvent.loaded * 100) / progressEvent.total)
  81. // onProgress({ percent })
  82. // }
  83. // }
  84. // })
  85. // return uploadResponse.data
  86. if (tokenResponse.data.code == 200) {
  87. return tokenResponse.data
  88. }
  89. } catch (error) {
  90. console.error('Upload error:', error)
  91. if (error.response) {
  92. return {
  93. code: error.response.status || 400,
  94. msg: error.response.data?.msg || error.message || 'Upload failed'
  95. }
  96. }
  97. return {
  98. code: 400,
  99. msg: error.message || 'Upload failed'
  100. }
  101. }
  102. }
  103. /**
  104. * 为 Element UI Upload 组件创建自定义上传方法
  105. * @param {String} originalUrl - 原上传接口URL
  106. * @param {Object} headers - 请求头
  107. * @returns {Function} http-request 方法
  108. */
  109. export function createUploadRequest(originalUrl, headers = {}) {
  110. return async (options) => {
  111. const { file, onProgress, onSuccess, onError } = options
  112. try {
  113. const result = await unifiedUpload(file, originalUrl, headers, onProgress)
  114. if (result.code === 200) {
  115. onSuccess(result)
  116. } else {
  117. onError(new Error(result.msg || 'Upload failed'))
  118. }
  119. } catch (error) {
  120. onError(error)
  121. }
  122. }
  123. }