Base64 转 File （附下载）

问题

当需要下载已经上传的文件时，后端太烂不愿意做，就只传了base64，然后丢给我们，这时候应该怎么办，这里有两个解决方法
1、打一顿就好了
2、老实自己写吧...

解决

1、先吧base64转换为File
通常base64的格式是 data:image/jpeg;base64,iVBORw0KGgoAAAANSU·······
前半截的 粉色部分是不需要的 包括逗号 ，后半截的才能转成File

const convertFile = base64 => {
  let fileArray = base64.split(','),
    // 过滤出文件类型
    fileType = fileArray[0].match(/:(.*?);/)[1],
    // atob 是对经过 base-64 编码的字符串进行解码
    bstr = atob(fileArray[1]),
    n = bstr.length,
    //Uint8Array 数组类型表示一个 8 位无符号整型数组
    u8arr = new Uint8Array(n)
  while (n--) {
    // 返回字符串n个字符的 Unicode 编码
    u8arr[n] = bstr.charCodeAt(n)
  }
  // return new Blob([u8arr], { type: fileType })
  return new File([u8arr], '文件名', { type: fileType })
}

Blob和File 差不多  看自己需要
至此已经成功转换，当然想要下载还没有完成

2、这个时候我们就可以通过 a 标签的特性来进行下文件

const buttonClick = (base64) => {
  //拿到转码后的 file 格式
  let file = dataURLtoFile(base64)
  // 动态创建 a 标签
  const node = document.createElement('a')
  // 静态方法会创建一个 DOMString
  node.href = URL.createObjectURL(file)
  // 下载的文件名
  node.download = file.name
  // 模拟点击下载
  node.click()
  // 释放刚刚创建的 DOMString
  URL.revokeObjectURL(node.href)
  //这里我吧它插入到了 body 里因为不查vue里面会报错，说子节点中不存在
  document.body.appendChild(node)
  // 删除 a 标签
  document.body.removeChild(node)
}

好了，完成，CV不容易呐，说实话 u8arr = new Uint8Array(n) 和 while 这里我还是不太清楚这含义，有无大佬给小弟讲解一下，‘ 肾 ’是感谢！