js中的blob,圖片base64URL,file之間的關系


js的base64編碼和解碼

英文是這樣的:
//
atob() 將base64解碼 // btoa() 將字符串轉碼為base64 var str = 'javascript'; window.btoa(str) //轉碼結果 "amF2YXNjcmlwdA==" window.atob("amF2YXNjcmlwdA==") //解碼結果 "javascript"



中文需要特殊一下。需要用到轉碼
encodeURIComponent 和 decodeURIComponent

console.log(window.btoa(encodeURIComponent("哈哈")))
console.log(decodeURIComponent(window.atob("JUU1JTkzJTg4JUU1JTkzJTg4")))
JUU1JTkzJTg4JUU1JTkzJTg4
哈哈

base64URL 轉 blob 對象,文件上傳 

/** 
* base64 轉 blob 對象,文件上傳 
 * 轉載自:http://blog.csdn.net/hsany330/article/details/52575459 
 * @param dataURI 
 * @returns {Blob} 
*
*/ function dataURItoBlob(dataURI) { var byteString = atob(dataURI.split(',')[1]); var mimeString = dataURI.split(',')[0].split(':')[1].split(';')[0]; var ab = new ArrayBuffer(byteString.length); var ia = new Uint8Array(ab); for (var i = 0; i < byteString.length; i++) { ia[i] = byteString.charCodeAt(i); } return new Blob([ab], {type: mimeString}); }

獲取file對象 ,獲取base64URL

var file=$("input[name='file']")[0];
console.log(file.files[0])

let reader = new FileReader();
reader.readAsDataURL (file1);
//reader對象的result屬性存儲流讀取的數據
'<img src="' + reader.result + '" alt=""/>'
console.log(reader.result) // 打印出轉換后的base64

 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM