File对象与base64互相转换以及本地下载

54 阅读1分钟

Base64 → File

const base64ToFile = (base64, filename, mimeType) => {
  const byteString = atob(base64);
  const arrayBuffer = new ArrayBuffer(byteString.length);
  const uintArray = new Uint8Array(arrayBuffer);
  
  for (let i = 0; i < byteString.length; i++) {
    uintArray[i] = byteString.charCodeAt(i);
  }
  return new File([arrayBuffer], filename, { type: mimeType });
};

File → Base64

const fileToBase64 = (file) => {
  return new Promise((resolve, reject) => {
    const reader = new FileReader();
    reader.onload = () => resolve(reader.result.split(',')); // 去除DataURL前缀
    reader.onerror = reject;
    reader.readAsDataURL(file);
  });
};

前端实现本地下载base64

/**
 * 下载Base64文件
 * @param {string} base64Data - 纯Base64数据(不含data:前缀)
 * @param {string} fileName - 下载文件名(含扩展名)
 * @param {string} mimeType - 文件MIME类型(如image/png)
 */
function downloadBase64File(base64Data, fileName, mimeType) {
  // 异常检测
  if (!base64Data || !fileName) {
    throw new Error('Base64数据和文件名不能为空');
  }

  // 构造Blob(兼容Safari 18+)
  const byteString = atob(base64Data);
  const arrayBuffer = new ArrayBuffer(byteString.length);
  const uintArray = new Uint8Array(arrayBuffer);
  
  for (let i = 0; i < byteString.length; i++) {
    uintArray[i] = byteString.charCodeAt(i);
  }

  // 创建临时链接
  const blob = new Blob([arrayBuffer], { type: mimeType });
  const url = URL.createObjectURL(blob);
  
  // 触发下载
  const link = document.createElement('a');
  link.href = url;
  link.download = fileName;
  document.body.appendChild(link);
  link.click();
  
  // 清理资源
  setTimeout(() => {
    document.body.removeChild(link);
    URL.revokeObjectURL(url);
  }, 100);
}