window.btoa

WindowOrWorkerGlobalScope.btoa() String 对象中创建一个 base-64 编码的 ASCII 字符串,其中字符串中的每个字符都被视为一个二进制数据字节。

Note: 由于这个函数将每个字符视为二进制数据的字节,而不管实际组成字符的字节数是多少,所以如果任何字符的码位超出 0x00 ~ 0xFF 范围,则会引发 InvalidCharacterError 异常。请参阅 Unicode_字符串 ,该示例演示如何编码字符数超出 0x00 ~ 0xFF 范围的字符串

语法

let encodedData = window.btoa(stringToEncode);

参数

stringToEncode
一个字符串, 其字符分别表示要编码为 ASCII 的二进制数据的单个字节。

返回值

    一个包含 stringToEncode 的 Base64 表示的字符串。

示例

let encodedData = window.btoa("Hello, world"); // base64 编码
let decodedData = window.atob(encodedData); // 解码 成 ASCII

备注

你可以使用此方法对可能导致通信问题的数据进行编码,传输,然后使用atob()方法再次解码数据。例如,您可以编码控制字符,例如ASCII值0到31。

在用javascript编写XPCOM组件时, btoa()方法也是可用的,虽然全局对象已经不是Window了。

Unicode 字符串

在多数浏览器中,使用btoa() 对Unicode字符串进行编码都会触发InvalidCharacterError异常。

一种选择是转义任何扩展字符,以便实际编码的字符串是原始字符的ASCII表示形式。考虑这个例子,代码来自Johan Sundström

// ucs-2 string to base64 encoded ascii
function utoa(str) {
    return window.btoa(unescape(encodeURIComponent(str)));
}
// base64 encoded ascii to ucs-2 string
function atou(str) {
    return decodeURIComponent(escape(window.atob(str)));
}
// Usage:
utoa('✓ à la mode'); // 4pyTIMOgIGxhIG1vZGU=
atou('4pyTIMOgIGxhIG1vZGU='); // "✓ à la mode"

utoa('I \u2661 Unicode!'); // SSDimaEgVW5pY29kZSE=
atou('SSDimaEgVW5pY29kZSE='); // "I ♡ Unicode!"

更好,更可靠,更廉价的解决方案是使用类型化数组进行转换。

规范

Specification Status Comment
HTML Living Standard
WindowOrWorkerGlobalScope.btoa()
Living Standard Method moved to the WindowOrWorkerGlobalScope mixin in the latest spec.
HTML 5.1
WindowBase64.btoa()
Recommendation Snapshot of HTML Living Standard. No change.
HTML5
WindowBase64.btoa()
Recommendation Snapshot of HTML Living Standard. Creation of WindowBase64 (properties where on the target before it).

浏览器兼容性

Update compatibility data on GitHub
DesktopMobile
ChromeEdgeFirefoxInternet ExplorerOperaSafariAndroid webviewChrome for AndroidFirefox for AndroidOpera for AndroidSafari on iOSSamsung Internet
btoaChrome Full support YesEdge Full support YesFirefox Full support 1
Full support 1
Full support 52
Notes
Notes btoa() now defined on WindowOrWorkerGlobalScope mixin.
IE Full support 10Opera Full support YesSafari Full support YesWebView Android Full support YesChrome Android Full support YesFirefox Android Full support 4
Full support 4
Full support 52
Notes
Notes atob() now defined on WindowOrWorkerGlobalScope mixin.
Opera Android ? Safari iOS Full support YesSamsung Internet Android ?

Legend

Full support  
Full support
Compatibility unknown  
Compatibility unknown
See implementation notes.
See implementation notes.

相关链接