javaScript 将base64转换为原格式文件

  1. 先将base64转换为blob
var dataurl = "data:image/jpeg;base64,/9j/4QBMRXhpZgAATU0AKgAAAAgA......"

// dataurl 就是一个base64
function dataURLtoBlob(dataurl) {
    let arr = dataurl.split(',')
    let mime = arr[0].match(/:(.*?);/)[1]
    let bstr = atob(arr[1])
    let n = bstr.length
    let u8arr = new Uint8Array(n)
    while (n--) {
      u8arr[n] = bstr.charCodeAt(n)
    }
    return new Blob([u8arr], { type: mime })
}

let blob = dataURLtoBlob(res)
  1. 再将blob转换为file
function blobToFile(theBlob, fileName) {
    theBlob.lastModifiedDate = new Date() // 文件最后的修改日期
    theBlob.name = fileName // 文件名
    return new File([theBlob], fileName, { type: theBlob.type, lastModified: Date.now() })
}

let file1 = blobToFile(blob, '王者')
  1. 下载file文件,或者,将图片显示在页面上
  const handleUploadFile = (file, fileName) => {
    // 创建blob对象
    const blob = new Blob([file])

// 目标1:创建img,将图片显示在页面上 
    const img = document.createElement('img')
    img.src = URL.createObjectURL(blob)
    img.width = 200
    img.height = 200
    document.body.appendChild(img)

// 目标2: 创建a标签,通过a标签实现下载
    const dom = document.createElement("a")
    dom.download = fileName
    dom.href = URL.createObjectURL(blob)
    dom.id = "upload-file-dom"
    dom.style.display = "none"
    document.body.appendChild(dom)

    // 触发点击事件
    dom.click()
    // 释放资源
    URL.revokeObjectURL(dom.href)
    document.getElementById("upload-file-dom")?.remove()
}

handleUploadFile(file1, '嗷嗷嗷.png')

你可能感兴趣的:(blob-base64,javascript)