javascript使用btoa和atob來進(jìn)行Base64轉(zhuǎn)碼和解碼
javascript原生的api本來就支持,Base64,但是由于之前的javascript局限性，導(dǎo)致Base64基本中看不中用。當(dāng)前html5標(biāo)準(zhǔn)正式化之際，Base64將有較大的轉(zhuǎn)型空間,對(duì)于Html5 Api中出現(xiàn)的如FileReader Api, 拖拽上傳,甚至是Canvas,Video截圖都可以實(shí)現(xiàn)。
好了，前言說了一大堆，Base64轉(zhuǎn)碼和解碼有哪些方法：
一.我們來看看，在javascript中如何使用Base64轉(zhuǎn)碼
var str = 'javascript';
window.btoa(str)
//轉(zhuǎn)碼結(jié)果 "amF2YXNjcmlwdA=="
window.atob("amF2YXNjcmlwdA==")
//解碼結(jié)果 "javascript"
二.對(duì)于轉(zhuǎn)碼來說，Base64轉(zhuǎn)碼的對(duì)象只能是字符串，因此來說，對(duì)于其他數(shù)據(jù)還有這一定的局限性，在此特別需要注意的是對(duì)Unicode轉(zhuǎn)碼。
var str = "China，中國(guó)" window.btoa(str)
Uncaught DOMException: Failed to execute 'btoa' on 'Window': The string to be encoded contains characters outside of the Latin1 range.
很明顯，這種方式是不行的，那么如何讓他支持漢字呢，
這就要使用window.encodeURIComponent和window.decodeURIComponent
var str = "China，中國(guó)";
window.btoa(window.encodeURIComponent(str))
//"Q2hpbmElRUYlQkMlOEMlRTQlQjglQUQlRTUlOUIlQkQ="
window.decodeURIComponent(window.atob('Q2hpbmElRUYlQkMlOEMlRTQlQjglQUQlRTUlOUIlQkQ='))
//"China，中國(guó)"
btoa與atob的使用方法就是這么簡(jiǎn)單,大家可以嘗試一下。希望本文的內(nèi)容對(duì)大家的學(xué)習(xí)或者工作能帶來一定的幫助，同時(shí)也希望多多支持腳本之家！
相關(guān)文章
本文主要介紹Google 地圖API資料,這里整理了Google地圖API的基本知識(shí)，并詳解每個(gè)函數(shù)的意思，有需要的小伙伴可以參考下2016-08-08
關(guān)于Javascript閉包與應(yīng)用的詳解
這篇文章主要介紹了關(guān)于Javascript閉包與應(yīng)用的詳解,文中有非常詳細(xì)的代碼示例.對(duì)正在學(xué)習(xí)js的伙伴們有很好的幫助,需要的朋友可以參考下2021-04-04
Javascript中bind()方法綁定函數(shù)的使用與實(shí)現(xiàn)
這篇文章主要為大家介紹了Javascript中bind()方法綁定函數(shù)的使用與實(shí)現(xiàn)示例詳解，有需要的朋友可以借鑒參考下，希望能夠有所幫助，祝大家多多進(jìn)步，早日升職加薪2023-06-06
微信小程序中input標(biāo)簽詳解及簡(jiǎn)單實(shí)例
這篇文章主要介紹了微信小程序中input標(biāo)簽詳解及簡(jiǎn)單實(shí)例的相關(guān)資料,需要的朋友可以參考下2017-05-05
這篇文章主要介紹了微信小程序Redux綁定實(shí)例詳解的相關(guān)資料,需要的朋友可以參考下2017-06-06
JavaScript編程中實(shí)現(xiàn)對(duì)象封裝特性的實(shí)例講解
JavaScript可以在一定程度上以面向?qū)ο蠓绞竭M(jìn)行編程,而封裝是面向?qū)ο笾械囊粋€(gè)重要特性,本文就來分享阮一峰老師對(duì)JavaScript編程中實(shí)現(xiàn)對(duì)象封裝特性的實(shí)例講解2016-06-06
這篇文章主要介紹了微信小程序 閉包寫法詳細(xì)介紹的相關(guān)資料,需要的朋友可以參考下2016-12-12
Javascript基礎(chǔ)知識(shí)中關(guān)于內(nèi)置對(duì)象的知識(shí)
這篇文章主要介紹了Javascript基礎(chǔ)知識(shí)中關(guān)于內(nèi)置對(duì)象的相關(guān)知識(shí)的相關(guān)資料,需要的朋友可以參考下面小編薇大家?guī)淼木饰恼?/div> 2021-09-09
這篇文章主要介紹了微信小程序 圖片上傳實(shí)例詳解的相關(guān)資料,需要的朋友可以參考下2017-05-05
這篇文章主要介紹了javascript對(duì)象3個(gè)屬性特征，writable可寫、enumerable可枚舉、configurable可配置，下面來看看文章的詳細(xì)內(nèi)容吧2021-11-11最新評(píng)論