cwg_crm_person_front_vu_realse/upload.js

/*
 * @Description: 统一上传工具，先获取uploadToken，再上传到新接口
 * @Author: Auto
 * @Date: 2024-01-01
 */
// axios 通过 <script> 标签在 HTML 中全局加载，直接使用全局变量

let ho = window.location.host.split('.')[1];
let host80 = 'https://secure.' + ho + '.com';
let host05 = 'https://file.' + ho + '.com';

/**
 * 统一上传方法
 * @param {File} file - 要上传的文件
 * @param {String} originalUrl - 原上传接口URL（用于获取uploadToken）
 * @param {Object} headers - 请求头
 * @param {Function} onProgress - 上传进度回调
 * @returns {Promise} 上传结果
 */
async function unifiedUpload(file, originalUrl, headers, onProgress) {
  headers = headers || {};
  onProgress = onProgress || null;
  try {
    // 第一步：调用原接口获取 uploadToken
    const formData = new FormData()
    formData.append('file', file)
    
    // 设置请求头
    const requestHeaders = {
      'Access-Token': sessionStorage.getItem("access_token") || '',
      'Language': sessionStorage.getItem("lang") || '',
      'CLIENT': sessionStorage.getItem("CLIENT") || ''
    };
    // ES5 方式合并 headers
    for (var key in headers) {
      if (headers.hasOwnProperty(key)) {
        requestHeaders[key] = headers[key];
      }
    }
    
    // 获取基础URL
    let baseURL = host80
    
    // 提取原接口路径
    let originalPath = originalUrl
    if (originalUrl.startsWith('http://') || originalUrl.startsWith('https://')) {
      // 完整URL，提取路径部分
      const urlObj = new URL(originalUrl)
      originalPath = urlObj.pathname
    }
    
    // 调用原接口获取 uploadToken（先不传文件，只获取token）
    // 如果原接口需要文件才能返回token，则传文件
    const tokenFormData = new FormData()
    tokenFormData.append('file', file)
    
    const tokenResponse = await window.axios.post(originalPath, tokenFormData, {
      baseURL: baseURL,
      headers: requestHeaders,
      timeout: 30000
    })
    
    // 从原接口响应中获取 uploadToken
    // 假设原接口返回格式为 { code: 200, data: { uploadToken: 'xxx', ... } } 或 { code: 200, uploadToken: 'xxx' }
    let uploadToken = null
    if (tokenResponse.data.code == 200) {
        if (tokenResponse.data.data.path) {
            // 如果直接返回 uploadToken
            uploadToken = tokenResponse.data.data.path
        }
    }
    
    if (!uploadToken) {
      throw new Error('Failed to get uploadToken from original upload interface')
    }
    
    // 第二步：使用新接口上传文件
    const uploadFormData = new FormData()
    uploadFormData.append('file', file)
    uploadFormData.append('uploadToken', uploadToken)
    
    const uploadResponse = await window.axios.post('/common/base/upload', uploadFormData, {
      baseURL: host05,
      headers: requestHeaders,
      timeout: 60000,
      onUploadProgress: (progressEvent) => {
        if (onProgress && progressEvent.total) {
          const percent = Math.round((progressEvent.loaded * 100) / progressEvent.total)
          onProgress({ percent })
        }
      }
    })
    
    return uploadResponse.data
    
  } catch (error) {
    console.error('Upload error:', error)
    if (error.response) {
      return {
        code: error.response.status || 400,
        msg: (error.response.data && error.response.data.msg) || error.message || 'Upload failed'
      }
    }
    return {
      code: 400,
      msg: error.message || 'Upload failed'
    }
  }
}

/**
 * 为 Element UI Upload 组件创建自定义上传方法
 * @param {String} originalUrl - 原上传接口URL
 * @param {Object} headers - 请求头
 * @returns {Function} http-request 方法
 */
function createUploadRequest(originalUrl, headers) {
  headers = headers || {};
  return async function(options) {
    const file = options.file;
    const onProgress = options.onProgress;
    const onSuccess = options.onSuccess;
    const onError = options.onError;
    
    try {
      const result = await unifiedUpload(file, originalUrl, headers, onProgress)
      
      if (result.code === 200) {
        onSuccess(result)
      } else {
        onError(new Error(result.msg || 'Upload failed'))
      }
    } catch (error) {
      onError(error)
    }
  }
}

// ES5 方式暴露到全局对象
if (typeof window !== 'undefined') {
  window.createUploadRequest = createUploadRequest;
}