Funktionsweise des JavaScript im Base64‑Tool
Das Base64‑Tool verwendet JavaScript, um Eingaben in Echtzeit zu kodieren und zu dekodieren, sowie um praktische Aktionen wie Kopieren, Löschen und Speichern als Textdatei auszuführen. Im Folgenden wird die Funktionsweise der wichtigsten Funktionen beschrieben.
1. Live‑Kodierung von Klartext zu Base64
Die Funktion encodeLive() wird immer dann aufgerufen, wenn sich der Inhalt
des Klartext‑Feldes ändert. Dazu ist ein input-Eventlistener auf dem
Klartext‑Textarea (plainText) gesetzt:
plainEl.addEventListener('input', encodeLive);
In encodeLive() passiert Folgendes:
- Der eingegebene Text wird mit
TextEncoder()in UTF‑8‑Bytes umgewandelt. - Diese Bytes werden in eine Binärzeichenkette konvertiert.
- Die Binärzeichenkette wird mit
btoa()in Base64 kodiert. - Das Ergebnis wird automatisch im Base64‑Feld (
base64Text) angezeigt.
2. Live‑Dekodierung von Base64 zu Klartext
Die Funktion decodeLive() wird immer dann aufgerufen, wenn sich der Inhalt
des Base64‑Feldes ändert. Dazu ist ein input-Eventlistener auf dem
Base64‑Textarea (base64Text) gesetzt:
base64El.addEventListener('input', decodeLive);
In decodeLive() passiert Folgendes:
- Der Base64‑String wird mit
atob()in eine Binärzeichenkette umgewandelt. - Diese Zeichenkette wird in ein
Uint8Arrayvon Bytes konvertiert. - Die Bytes werden mit
TextDecoder()wieder in Klartext dekodiert. - Der entschlüsselte Text wird automatisch im Klartext‑Feld angezeigt.
- Bei ungültigem Base64 wird eine Fehlermeldung im Fehlerfeld (
base64Error) ausgegeben.
3. Kopieren des Inhalts
Die Funktion copyText(id) kopiert den Inhalt eines Textfeldes in die Zwischenablage:
- Über die
idwird das entsprechende Textfeld gefunden. - Der Inhalt wird mit
select()markiert. document.execCommand('copy')legt den Text in die Zwischenablage.
4. Löschen des Inhalts
Die Funktion clearText(id) setzt den Inhalt des angegebenen Textfeldes auf
einen leeren String:
- Das Textfeld wird über seine
idgefunden. - Der Wert wird auf
''gesetzt. - Eventuelle Fehlermeldungen in
plainErrorundbase64Errorwerden gelöscht.
5. Speichern als TXT‑Datei
Die Funktion saveText(id, filename) ermöglicht das Herunterladen des Inhalts
eines Textfeldes als .txt-Datei:
- Der Text wird aus dem entsprechenden Textfeld gelesen.
- Ein
Blobmit dem MIME‑Typtext/plainwird erzeugt. - Über ein temporäres
<a>-Element mitdownload-Attribut wird der Download ausgelöst. - Die erzeugte URL wird anschließend wieder freigegeben (
URL.revokeObjectURL()).
Alle Funktionen arbeiten vollständig im Browser und senden keine Daten an externe Server. Dadurch ist das Tool schnell, direkt und datenschutzfreundlich.