前端将blob转换为可下载的url及下载

一.转换

//将blob转换为url
const changeBlobToUrl = blobData => {
    return new Promise(resolve => {
        //创建Blob对象
        const blob = new Blob([blobData])

        // 创建FileReader对象
        const reader = new FileReader()

        reader.onload = function (e) {
            resolve(e.target.result)
        }

        // 使用FileReader读取Blob数据
        reader.readAsDataURL(blob)
    })
}

二.下载

//前端下载blob的url类型文件
const downloadFileByBlobUrl = (url: string, name: string) => {
    aDownload(url, name)
    URL.revokeObjectURL(url)
}

const aDownload = (url, name) => {
    // 创建<a>元素
    const link = document.createElement("a")
    // 设置<a>元素的属性
    link.href = url
    link.download = name
    // 将<a>元素添加到文档中
    document.body.appendChild(link)
    // 触发点击事件
    link.click()
    // 移除<a>元素
    document.body.removeChild(link)
}