美文网首页
File文件几种格式的相互转换

File文件几种格式的相互转换

作者: 菜鸟的平凡之路 | 来源:发表于2020-07-03 16:14 被阅读0次

file、blob、canvas、dataUrl几种对象之间的转换

  • blob|file对象转成dataUrl
    function readBlobAsDataURL (blob|file, callback) {
        let fr = new FileReader()
        fr.onload = function (e) {
            callback && callback(e.target.result)
        }
        fr.readAsDataURL(blob)
    }
  • canvas转换成dataUrl
    canvas.toDataURL('image/png'|'image/jpeg',0.8)
  • dataUrl转换成blob
    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 })
    }
  • dataUrl转换成file
     function dataURLtoFile (dataurl, filename) {
        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 File([u8arr], filename, { type: mime })
    }
  • 文件大小格式化
    function formateFileSize(fileSize) {
        if (fileSize === 0) {
            return '0.0M'
        }
        if (fileSize < 1024) {
            return `${fileSize}B`
        } else if (fileSize < 1024 * 1024) {
            return `${(fileSize / 1024).toFixed(2)}KB`
        } else if (fileSize < 1024 * 1024 * 1024) {
            return `${(fileSize / 1024 / 1024).toFixed(2)}MB`
        } else {
            return `${(fileSize / 1024 / 1024 / 1024).toFixed(2)}GB`
        }
    }

相关文章

网友评论

      本文标题:File文件几种格式的相互转换

      本文链接:https://www.haomeiwen.com/subject/sywsqktx.html