亚洲乱码中文字幕综合,中国熟女仑乱hd,亚洲精品乱拍国产一区二区三区,一本大道卡一卡二卡三乱码全集资源,又粗又黄又硬又爽的免费视频

js中base64、url和blob之間相互轉換的3種方式(詳細代碼)

 更新時間：2023年10月10日 08:31:13   作者：世界太過浮夸  
這篇文章主要給大家介紹了關于js中base64、url和blob之間相互轉換的3種方式,Blob和File是用來表示二進制數(shù)據(jù)的,而Base64則是一種編碼方式,用來把二進制數(shù)據(jù)編碼成可讀的字符串,需要的朋友可以參考下

url轉換為base64

 function urlToBase64(url) {
        return new Promise((resolve, reject) => {
            let image = new Image();
            image.onload = function () {
                let canvas = document.createElement('canvas');
                canvas.width = this.naturalWidth;
                canvas.height = this.naturalHeight;
                // 將圖片插入畫布并開始繪制
                canvas.getContext('2d').drawImage(image, 0, 0);
                // result
                let result = canvas.toDataURL('image/png')
                resolve(result);
            };
            // CORS 策略，會存在跨域問題https://stackoverflow.com/questions/20424279/canvas-todataurl-securityerror
            image.setAttribute("crossOrigin", 'Anonymous');
            image.src = url;
            // 圖片加載失敗的錯誤處理
            image.onerror = () => {
                reject(new Error('urlToBase64 error'));
            };
        })
    }

調用：

 urlToBase64(url).then(res=> {
      // 轉化后的base64圖片地址
 	  console.log('base64', res)
});

blob 轉 url

function blobToBase64(blob) {
  return new Promise((resolve, reject) => {
    const fileReader = new FileReader();
    fileReader.onload = (e) => {
      resolve(e.target.result);
    };
    // readAsDataURL
    fileReader.readAsDataURL(blob);
    fileReader.onerror = () => {
      reject(new Error('blobToBase64 error'));
    };
  });
}

調用：

blobToBase64(blob).then(res => {
  // 轉化后的base64
  console.log('base64', res)
})

base64 轉 Blob

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

blob轉 File

 function blobToFile(blob, name) {
        return new File([blob], name + '.png', { type: blob.type });
    }

總結 

到此這篇關于js中base64、url和blob之間相互轉換的3種方式的文章就介紹到這了,更多相關js base64、url和blob相互轉換內(nèi)容請搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關文章希望大家以后多多支持腳本之家！

相關文章

最新評論