Anleitung
- Ziehen Sie eine Audiodatei auf den Ablagebereich oder klicken Sie darauf, um eine auszuwählen: MP3, WAV, OGG, M4A, FLAC oder ein anderes Format.
- Spielen Sie sie im Vorschau-Player ab, um zu prüfen, ob es der richtige Sound ist.
- Wählen Sie unter „Ausgabe“ „Data-URI“ für ein HTML-audio-Element oder „Base64“ für eine API-Anfrage.
- Übernehmen Sie das Ergebnis mit „Kopieren“ oder speichern Sie es mit „Herunterladen“ als .txt-Datei.
Base64-Audio auf einer Webseite abspielen
Eine Data-URI mit einem Audio-MIME-Typ funktioniert überall dort, wo ein Browser eine Audio-URL erwartet:
<audio controls src="data:audio/mpeg;base64,..."></audio>
// JavaScript: kurzen Sound beim Klick auf eine Schaltfläche abspielen
const click = new Audio('data:audio/wav;base64,...');
button.addEventListener('click', () => click.play());
Browser blockieren in der Regel die Tonwiedergabe, bevor der Besucher mit der Seite interagiert hat. Rufen Sie play() daher in einem Klick- oder Tastatur-Handler auf und nicht beim Laden der Seite.
Sinnvolle Einsatzzwecke für Base64-Audio
- Kurze Interface-Sounds. Klicks, Benachrichtigungstöne und Fehlersignale von wenigen Kilobyte können direkt in Ihrem JavaScript-Bundle liegen und werden so sofort und ohne zusätzliche Anfrage abgespielt.
- Offline- und Einzeldatei-Apps. Spiele, Kiosksysteme, E-Learning-Pakete und HTML-Berichte, die aus einer einzigen Datei ohne Server funktionieren müssen, können ihre Sounds eingebettet mitführen.
- Speech-to-Text-APIs. Viele Cloud-Dienste für Spracherkennung akzeptieren eine kurze Aufnahme als Base64-Feld in einer JSON-Anfrage, oft
contentoderaudiogenannt. Meist erwarten sie ein bestimmtes Format, eine bestimmte Abtastrate und Kanalanzahl. Dieses Tool kodiert die Datei genau so, wie sie ist, und konvertiert oder resampelt sie nicht. - Testdaten. Tests für Audioverarbeitungscode können ein winziges Sample als String-Konstante enthalten.
Wann Sie Base64 für Audio besser nicht verwenden
Base64 vergrößert die Datei um etwa ein Drittel, und der Browser muss den gesamten String empfangen, bevor die Wiedergabe beginnen kann. Es gibt kein Streaming, kein separates Caching und keine Range-Requests zum Vor- und Zurückspulen. Ein 5-minütiges MP3 mit 128 kbit/s ist etwa 4,8 MB groß und wird zu rund 6,4 MB Text in Ihrem HTML oder JavaScript, der bei jeder Änderung dieser Datei erneut heruntergeladen wird. Für Musik, Podcasts und andere lange Aufnahmen sollten Sie eine normale Audiodatei bereitstellen. Als Faustregel gilt: Betten Sie nur Sounds ein, die wenige Sekunden dauern.
Audioformate und MIME-Typen
| Format | Data-URI-Präfix | Hinweise |
|---|---|---|
| MP3 | data:audio/mpeg;base64, | Kompakt, wird in jedem Browser abgespielt |
| WAV | data:audio/wav;base64, | Unkomprimiert und groß; gut für sehr kurze Sounds |
| OGG (Vorbis, Opus) | data:audio/ogg;base64, | Kompakt; ältere Safari-Versionen können es nicht abspielen |
| M4A (AAC) | data:audio/mp4;base64, | Kompakt, breit unterstützt |
| FLAC | data:audio/flac;base64, | Verlustfrei, deutlich größer als MP3 oder AAC |
Je nach Betriebssystem wird eine Datei unter Umständen mit einer abweichenden Typangabe wie audio/x-wav oder audio/x-m4a gemeldet. Browser spielen auch diese in der Regel ab, und Sie können das Präfix anpassen, falls eine Plattform einen bestimmten Typ benötigt.
Häufig gestellte Fragen
Welchen MIME-Typ hat MP3 in einer Data-URI?
audio/mpeg, die Data-URI beginnt also mit data:audio/mpeg;base64,. In der Praxis begegnet Ihnen auch audio/mp3. Manche Browser akzeptieren das, aber audio/mpeg ist die sichere Wahl.Warum spielt die Vorschau meine Datei nicht ab?
Der Player nutzt die in Ihren Browser integrierten Codecs. Unterstützt der Browser ein Format nicht, etwa OGG in älteren Safari-Versionen, bleibt die Vorschau stumm. Die Base64-Ausgabe ist trotzdem eine exakte Kopie der Datei.
Wie lang darf ein Base64-Audioclip sein?
Das Tool kodiert Dateien bis 100 MB, doch das ist viel zu groß zum Einbetten. Für eingebettete Sounds sollten Clips nur wenige Sekunden lang und einige Dutzend Kilobyte groß sein. Prüfen Sie bei Sprach-APIs das Limit für eingebettetes Audio, das oft deutlich niedriger liegt als für Audio, das in einen Speicher hochgeladen wird.
Kann ich hier MP3 in WAV umwandeln?
Nein. Das Tool kodiert die Datei unverändert, ohne Format, Bitrate oder Abtastrate zu ändern. Konvertieren Sie das Audio zuerst mit einem Audioeditor oder einem Kommandozeilen-Tool wie FFmpeg und kodieren Sie dann das Ergebnis.
Wird meine Audiodatei hochgeladen?
Nein. Kodierung und Wiedergabe finden in Ihrem Browser statt, und die Datei bleibt auf Ihrem Gerät.