【js通用小工具函数】将base64转BLOB / File对象

---

今天项目中有这个需求，顺手写两个工具函数备用，省的下次再写

采用了文档注释，有相似需求的小伙伴直接复制粘贴即可

---

1.将Base64编码的字符串转换为Blob对象
代码如下

/**
 * 将Base64编码的字符串转换为Blob对象。
 * Blob对象用于表示二进制大型对象，可以在浏览器环境中处理大文件或二进制数据。
 * 
 * @param base64 Base64编码的字符串。
 * @param contentType 可选参数，表示生成的Blob对象的MIME类型，默认为空字符串。
 * @param sliceSize 可选参数，表示分片大小，默认为512字节。用于控制每次处理的Base64字符串长度，以优化大文件的处理。
 * @returns 返回转换后的Blob对象，如果转换失败，则返回null。
 */
// base64转blob
export const base64ToBlob = function (
  base64: string,
  contentType = "",
  sliceSize = 512
) {
  const cleanedBase64 = base64.split(",")[1] || base64;
  const fixedBase64 = cleanedBase64.replace(/-/g, "+").replace(/_/g, "/");
  const padding = "=".repeat((4 - (fixedBase64.length % 4)) % 4);
  const validBase64 = fixedBase64 + padding;

  try {
    const byteCharacters = atob(validBase64);
    const byteArrays = [];

    // 将二进制数据分片处理，每片长度为sliceSize，创建Uint8Array数组。
    for (let offset = 0; offset < byteCharacters.length; offset += sliceSize) {
      const slice = byteCharacters.slice(offset, offset + sliceSize);

      const byteNumbers = new Array(slice.length);
      for (let i = 0; i < slice.length; i++) {
        byteNumbers[i] = slice.charCodeAt(i);
      }

      // 创建Uint8Array数组，用于表示二进制数据的一个片段。
      const byteArray = new Uint8Array(byteNumbers);
      byteArrays.push(byteArray);
    }

    // 创建Blob对象，包含所有的二进制数据片段，并指定MIME类型。
    return new Blob(byteArrays, { type: contentType });
  } catch (e) {
    console.error("Failed to convert base64 to blob:", e);
    return null;
  }
};

---

2.将Base64编码的字符串转换为File对象

/**
 * 将Base64编码的字符串转换为File对象。
 * 这个函数接受一个Base64编码的字符串，一个可选的文件名和一个可选的MIME类型，
 * 并返回一个代表原始数据的File对象。
 * 
 * @param base64 Base64编码的字符串。
 * @param fileName 文件名，默认为"file.txt"。
 * @param mimeType MIME类型，默认为"text/plain"。
 * @returns 返回一个File对象，包含解码后的数据。
 */
export const base64ToFile = function (
  base64:string,
  fileName = "file.txt",
  mimeType = "text/plain"
) {
  const base64String = base64.replace(/^data:.+;base64,/, "");

  const fixedBase64 = base64String.replace(/-/g, "+").replace(/_/g, "/");
  const padding = "=".repeat((4 - (fixedBase64.length % 4)) % 4);
  const validBase64 = fixedBase64 + padding;
  
  const byteCharacters = atob(validBase64);
  
  // 将字节序列分割成512字节的块，并将每个块转换为Uint8Array，以便创建Blob对象。
  const byteArrays = [];
  
  for (let offset = 0; offset < byteCharacters.length; offset += 512) {
    const slice = byteCharacters.slice(offset, offset + 512);
    const byteNumbers = new Array(slice.length);

    for (let i = 0; i < slice.length; i++) {
      byteNumbers[i] = slice.charCodeAt(i);
    }

    byteArrays.push(new Uint8Array(byteNumbers));
  }
 
  // 使用前面创建的字节数组块创建Blob对象。
  const blob = new Blob(byteArrays, { type: mimeType });
  
  return new File([blob], fileName, { type: mimeType });
};