Base64

基本概念

• base64是以字符串的形式表示图片，也可以理解为二进制的图片以字符串的形式显示，

• 优点
  • 因为是以字符串形式表示，可以嵌入到json，txt等各个文件中保存，方便传输

• 缺点
  • base64的图片转换后总体大小会比原图大，具体大多少是以原图尺寸决定，1/5 ~ 1/3 不等
  • 读取图片需要重新解码，如果时服务器解码，则相当于一次开销，不过一般都在客户端解码

转换

Base64字符串 转 File对象

/**
 * @Description - btoa和atob是window对象的两个函数，其中btoa是binary to ascii，用于将binary的数据用ascii码表示，即Base64的编码过程，而atob则是ascii to binary，用于将ascii码解析成binary数据
 * 
 * @param {base64Image} base64Image  - base64图片格式的字符串 异步以 data:image/jpeg;base64 xxxx 开头
 * 
 * @returns {} - {description}
 * 
 */
function dataURLtoFile(base64Image) {

  let [h, mimeType, type, base64str] = base64Image.split(/:|,|;/);
  let binary = atob(base64str);

  let array = [];
  for (let i = 0; i < binary.length; i++) {
    array.push(binary.charCodeAt(i));
  }
  let fileData = new Blob([new Uint8Array(array)], {
    type: mimeType,
  });

  let ext = mimeType.split("/")[1];
  console.log("ext: ", ext);
  let fileOfBlob = new File([fileData], `${new Date().getTime()}.${ext}`); // 重命名了
  return fileOfBlob;
}