1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
|
---
title: WindowBase64.btoa()
slug: Web/API/WindowBase64/btoa
tags:
- API
- Méthode
- Referenz
translation_of: Web/API/WindowOrWorkerGlobalScope/btoa
---
<div>{{APIRef("HTML DOM")}}</div>
<p>Erzeugt eine Base-64-kodierten ASCII-Zeichenkette aus einer "Zeichenkette" von Binärdaten.</p>
<p>Hinweis: diese Funktion ist nicht für Raw-<a href="http://www.unicode.org/standard/WhatIsUnicode.html">Unicode</a>-Zeichenketten geeignet (siehe Abschnitt "Unicode-Zeichenketten" unten).</p>
<h2 id="Syntax">Syntax</h2>
<pre class="syntaxbox">var encodedData = window.btoa(<em>stringToEncode</em>);</pre>
<h2 id="Example">Example</h2>
<pre class="brush:js">var encodedData = window.btoa("Hello, world"); // Zeichenkette kodieren
var decodedData = window.atob(encodedData); // Zeichenkette dekodieren
</pre>
<h2 id="Hinweise">Hinweise</h2>
<p>Diese Methode kann verwendet werden, um Daten zu kodieren, übertragen, und mittels<code> {{domxref("WindowBase64.atob","window.atob()")}}</code> wieder zu dekodieren, welche andernfalls Übertragungsprobleme bereiten würden. Beispielsweise ist es möglich, die Steuerzeichen mit den ASCII-Werten 0 bis 31 zu kodieren.</p>
<p><code>btoa()</code> steht auch in JavaScript implementierten XPCOM-Komponenten zur Verfügung, auch wenn <a href="/en-US/docs/DOM/window" title="DOM/window"><code>window</code></a> in solchen Komponenten nicht das globale Objekt ist.</p>
<h2 id="Unicode-Zeichenketten">Unicode-Zeichenketten</h2>
<p>In den meisten Browsern verursacht ein Aufruf von <code>window.btoa()</code> mit einer Unicode-Zeichenkette eine "Character Out Of Range"-Exception ("Zeichen außerhalb des zulässigen Wertebereichs").</p>
<p>Das kann mithilfe eines solchen Code-Schemas vermieden werden (beigesteuert von <a class="external" href="http://ecmanaut.blogspot.com/2006/07/encoding-decoding-utf8-in-javascript.html" title="http://ecmanaut.blogspot.com/2006/07/encoding-decoding-utf8-in-javascript.html">Johan Sundström</a>):</p>
<pre class="brush:js">function utf8_to_b64(str) {
return window.btoa(unescape(encodeURIComponent(str)));
}
function b64_to_utf8(str) {
return decodeURIComponent(escape(window.atob(str)));
}
// Usage:
utf8_to_b64('✓ à la mode'); // JTI1dTI3MTMlMjUyMCUyNUUwJTI1MjBsYSUyNTIwbW9kZQ==
b64_to_utf8('JTI1dTI3MTMlMjUyMCUyNUUwJTI1MjBsYSUyNTIwbW9kZQ=='); // "✓ à la mode"
utf8_to_b64('I \u2661 Unicode!'); // SSUyNTIwJTI1dTI2NjElMjUyMFVuaWNvZGUlMjUyMQ==
b64_to_utf8('SSUyNTIwJTI1dTI2NjElMjUyMFVuaWNvZGUlMjUyMQ=='); // "I ♡ Unicode!"
</pre>
<p>Eine günstigere, zuverlässigere und effizientere Lösung ist, <a href="/en-US/docs/Web/API/DOMString" title="/en-US/docs/Web/API/DOMString"><code>DOMString</code></a> zunächst in eine UTF-8-kodierte Zeichenkette zu konvertieren, die sich für <a href="/en-US/docs/Web/JavaScript/Typed_arrays" title="/en-US/docs/Web/JavaScript/Typed_arrays">typed arrays</a> eignet. Eine Anleitung bietet <strong><a href="/en-US/docs/Web/JavaScript/Base64_encoding_and_decoding#Solution_.232_.E2.80.93_rewriting_atob()_and_btoa()_using_TypedArrays_and_UTF-8" title="/en-US/docs/Web/JavaScript/Base64_encoding_and_decoding#Solution_.232_.E2.80.93_rewriting_atob()_and_btoa()_using_TypedArrays_and_UTF-8">dieser Abschnitt</a></strong>.</p>
<h2 id="Specifications">Specifications</h2>
<table class="standard-table">
<thead>
<tr>
<th scope="col">Specification</th>
<th scope="col">Status</th>
<th scope="col">Comment</th>
</tr>
</thead>
<tbody>
<tr>
<td>{{SpecName('HTML WHATWG', '#dom-windowbase64-btoa', 'WindowBase64.btoa()')}}</td>
<td>{{Spec2('HTML WHATWG')}}</td>
<td>No change since the latest snapshot, {{SpecName("HTML5.1")}}.</td>
</tr>
<tr>
<td>{{SpecName('HTML5.1', '#dom-windowbase64-btoa', 'WindowBase64.btoa()')}}</td>
<td>{{Spec2('HTML5.1')}}</td>
<td>Snapshot of {{SpecName("HTML WHATWG")}}. No change.</td>
</tr>
<tr>
<td>{{SpecName("HTML5 W3C", "#dom-windowbase64-btoa", "WindowBase64.btoa()")}}</td>
<td>{{Spec2('HTML5 W3C')}}</td>
<td>Snapshot of {{SpecName("HTML WHATWG")}}. Creation of <code>WindowBase64</code> (properties where on the target before it).</td>
</tr>
</tbody>
</table>
<h2 id="Browser_compatibility">Browser compatibility</h2>
<div>{{CompatibilityTable}}</div>
<div id="compat-desktop">
<table class="compat-table">
<tbody>
<tr>
<th>Feature</th>
<th>Chrome</th>
<th>Firefox (Gecko)</th>
<th>Internet Explorer</th>
<th>Opera</th>
<th>Safari (WebKit)</th>
</tr>
<tr>
<td>Basic support</td>
<td>{{CompatVersionUnknown}}</td>
<td>{{CompatGeckoDesktop(1)}}[1]</td>
<td>10</td>
<td>{{CompatVersionUnknown}}</td>
<td>{{CompatVersionUnknown}}</td>
</tr>
</tbody>
</table>
</div>
<div id="compat-mobile">
<table class="compat-table">
<tbody>
<tr>
<th>Feature</th>
<th>Android</th>
<th>Firefox Mobile (Gecko)</th>
<th>IE Mobile</th>
<th>Opera Mobile</th>
<th>Safari Mobile</th>
</tr>
<tr>
<td>Basic support</td>
<td>{{CompatVersionUnknown}}</td>
<td>{{CompatGeckoMobile(1)}}</td>
<td>{{CompatNo}}</td>
<td>{{CompatUnknown}}</td>
<td>{{CompatVersionUnknown}}</td>
</tr>
</tbody>
</table>
</div>
<p>[1] <code>btoa()</code> is also available to XPCOM components implemented in JavaScript, even though <code><a href="/en-US/docs/DOM/window">window</a></code> is not the global object in components.</p>
<h2 id="See_also">See also</h2>
<ul>
<li><a href="/Web/API/WindowBase64/Base64_encoding_and_decoding">Base64 encoding and decoding</a></li>
<li><a href="/en-US/docs/data_URIs"><code>data</code> URIs</a></li>
<li>{{domxref("WindowBase64.atob","window.atob()")}}</li>
<li><a href="/en-US/docs/Components.utils.importGlobalProperties">Components.utils.importGlobalProperties</a></li>
</ul>
|
