Web Audio API

Baseline Weitgehend verfügbar *

Diese Funktion ist gut etabliert und funktioniert auf vielen Geräten und in vielen Browserversionen. Sie ist seit April 2021 browserübergreifend verfügbar.

* Einige Teile dieser Funktion werden möglicherweise unterschiedlich gut unterstützt.

Mehr erfahren
Vollständige Kompatibilität anzeigen

Die Web Audio API bietet ein leistungsstarkes und vielseitiges System zur Steuerung von Audio im Web. Sie ermöglicht Entwicklern die Auswahl von Audioquellen, das Hinzufügen von Effekten zu Audio, das Erstellen von Audio-Visualisierungen, das Anwenden von räumlichen Effekten (wie Panning) und vieles mehr.

Web-Audio-Konzepte und Nutzung

Die Web Audio API umfasst die Handhabung von Audiooperationen innerhalb eines Audiokontexts und wurde so konzipiert, dass sie modulares Routing ermöglicht. Grundlegende Audiooperationen werden mit Audionodes durchgeführt, die miteinander verbunden sind, um einen Audio-Routing-Graphen zu bilden. Mehrere Quellen — mit unterschiedlichen Arten von Kanal-Layouts — werden sogar innerhalb eines einzigen Kontexts unterstützt. Dieses modulare Design bietet die Flexibilität, komplexe Audiofunktionen mit dynamischen Effekten zu erstellen.

Audionodes sind über ihre Ein- und Ausgänge in Ketten und einfachen Netzen miteinander verbunden. Sie starten typischerweise mit einer oder mehreren Quellen. Quellen liefern Arrays von Samples — Messwerte der Amplitude des Audiosignals zu aufeinanderfolgenden Zeitpunkten — oft Zehntausende pro Sekunde. Diese können entweder mathematisch berechnet werden (wie OscillatorNode), oder sie können Aufnahmen von Ton-/Videodateien sein (wie AudioBufferSourceNode und MediaElementAudioSourceNode) und Audiostreams (MediaStreamAudioSourceNode). Tatsächlich sind Audiodateien nur Aufnahmen von Schallintensitäten selbst, die von Mikrofonen oder elektrischen Instrumenten aufgenommen werden und zu einer einzigen, komplizierten Welle gemischt werden.

Ausgaben dieser Nodes können mit Eingängen anderer Nodes verknüpft werden, die diese Streams von Tonsamples in verschiedene Streams mischen oder modifizieren. Eine häufige Modifikation ist das Multiplizieren der Samples mit einem Wert, um sie lauter oder leiser zu machen (so wie beim GainNode). Sobald der Ton ausreichend für den beabsichtigten Effekt bearbeitet wurde, kann er mit dem Eingang eines Ziels (BaseAudioContext.destination) verbunden werden, welches den Ton an die Lautsprecher oder Kopfhörer sendet. Diese letzte Verbindung ist nur notwendig, wenn der Benutzer das Audio hören soll.

Ein einfaches, typisches Workflow für Web-Audio könnte folgendermaßen aussehen:

Erstellen eines Audiokontexts
Innerhalb des Kontexts Quellen erstellen — wie <audio>, Oszillator, Stream
Erstellen von Effekt-Nodes, wie Hall, Biquad-Filter, Panner, Kompressor
Bestimmen des endgültigen Ziels des Audios, beispielsweise Ihre Systemlautsprecher
Verbinden der Quellen mit den Effekten und der Effekte mit dem Ziel

Ein einfaches Blockdiagramm mit einem äußeren Kasten mit der Bezeichnung Audiokontext und drei inneren Kästen mit der Bezeichnung Quellen, Effekte und Ziel. Die drei inneren Kästen haben Pfeile zwischen sich, die von links nach rechts zeigen und den Fluss von Audioinformationen anzeigen.

Das Timing wird mit hoher Präzision und geringer Latenz gesteuert, sodass Entwickler Code schreiben können, der genau auf Ereignisse reagiert und in der Lage ist, bestimmte Samples anzusprechen, auch bei einer hohen Samplerate. Anwendungen wie Drum Machines und Sequenzer sind daher sehr gut machbar.

Die Web Audio API ermöglicht es uns auch, zu steuern, wie Audio räumlich verteilt wird. Mit einem auf einem Quellen-Hörer-Modell basierenden System ermöglicht sie die Steuerung des Panning-Modells und behandelt die Entfernungsbedingte Abschwächung, die durch eine bewegte Quelle (oder einen bewegten Hörer) verursacht wird.

Hinweis: Details zur Theorie der Web Audio API finden Sie ausführlich in unserem Artikel Grundlegende Konzepte hinter der Web Audio API.

Zielgruppe der Web Audio API

Die Web Audio API kann einschüchternd wirken für diejenigen, die mit Audio- oder Musikbegriffen nicht vertraut sind. Da sie eine Vielzahl von Funktionen umfasst, kann es für Entwickler schwierig sein, den Einstieg zu finden.

Sie kann verwendet werden, um Audio in Ihre Website oder Anwendung zu integrieren, indem Sie beispielsweise Atmosphäre schaffen wie futurelibrary.no oder akustische Rückmeldungen zu Formularen. Aber sie kann auch verwendet werden, um fortgeschrittene interaktive Instrumente zu erstellen. In diesem Sinne ist sie sowohl für Entwickler als auch Musiker gleichermaßen geeignet.

Wir haben ein einfaches einführendes Tutorial für diejenigen, die mit Programmierung vertraut sind, aber eine gute Einführung in einige der Begriffe und Strukturen der API benötigen.

Es gibt auch einen Artikel über die grundlegenden Konzepte hinter der Web Audio API, der Ihnen hilft zu verstehen, wie digitale Audioarbeiten speziell im Bereich der API funktionieren. Dieser enthält auch eine gute Einführung in einige der Konzepte, auf denen die API basiert.

Programmieren lernen ist wie Karten spielen — man lernt die Regeln, dann spielt man, dann lernt man die Regeln erneut, dann spielt man erneut. Wenn also einige der Theorien nach dem ersten Tutorial und Artikel nicht ganz passen, gibt es ein fortgeschrittenes Tutorial, das das erste erweitert, um Ihnen zu helfen, das Gelernte zu üben und einige fortgeschrittene Techniken anzuwenden, um einen Step-Sequenzer aufzubauen.

Wir haben auch andere Tutorials und umfassendes Referenzmaterial verfügbar, das alle Funktionen der API abdeckt. Siehe die Sidebar auf dieser Seite für mehr.

Wenn Sie mehr mit der musikalischen Seite vertraut sind und musikalische Theorie-Konzepte kennen und Instrumente bauen möchten, dann können Sie mit dem fortgeschrittenen Tutorial und anderen als Leitfaden beginnen (das oben verlinkte Tutorial deckt das Planen von Noten, das Erstellen maßgeschneiderter Oszillatoren und Hüllkurven sowie eines LFO unter anderem ab.)

Wenn Sie nicht mit den Grundlagen der Programmierung vertraut sind, möchten Sie möglicherweise zuerst einige JavaScript-Tutorials für Anfänger konsultieren und dann hierher zurückkehren — siehe unser JavaScript-Lernmodul für Anfänger, um einen großartigen Einstieg zu finden.

Web Audio API Schnittstellen

Die Web Audio API verfügt über eine Reihe von Schnittstellen und zugehörigen Ereignissen, die wir in neun Funktionskategorien unterteilt haben.

Allgemeine Definition des Audio-Graphs

Allgemeine Container und Definitionen, die Audio-Graphen in der Nutzung der Web Audio API formen.

AudioContext: Die AudioContext-Schnittstelle repräsentiert einen Audio-Verarbeitungsgrafen, der aus Audio-Modulen besteht, die miteinander verbunden sind, wobei jedes durch eine AudioNode dargestellt wird. Ein Audiokontext steuert die Erstellung der Nodes, die er enthält und die Ausführung der Audioverarbeitung oder Dekodierung. Sie müssen einen AudioContext erstellen, bevor Sie irgendetwas anderes tun, da alles innerhalb eines Kontexts passiert.
AudioNode: Die AudioNode-Schnittstelle repräsentiert ein Audiomodul wie eine Audioquelle (z.B. ein HTML <audio> oder <video> Element), Audiouziel, Zwischenverarbeitungsmodul (z.B. ein Filter wie BiquadFilterNode oder Lautstärkeregler wie GainNode).
AudioParam: Die AudioParam-Schnittstelle repräsentiert einen Audio-bezogenen Parameter, wie einer von einem AudioNode. Er kann auf einen spezifischen Wert oder eine Wertänderung gesetzt werden und kann so geplant werden, dass er zu einem bestimmten Zeitpunkt und nach einem bestimmten Muster erfolgt.
AudioParamMap: Bietet eine map-ähnliche Schnittstelle zu einer Gruppe von AudioParam Schnittstellen, was bedeutet, dass sie die Methoden forEach(), get(), has(), keys() und values() sowie eine size-Eigenschaft bereitstellt.
BaseAudioContext: Die BaseAudioContext-Schnittstelle dient als Basisdefinition für Online- und Offline-Audio-Verarbeitungsgrafen, wie sie durch AudioContext und OfflineAudioContext dargestellt werden. Sie würden BaseAudioContext nicht direkt verwenden, sondern seine Funktionen über eine der beiden vererbenden Schnittstellen nutzen.
Das ended-Ereignis: Das ended-Ereignis wird ausgelöst, wenn die Wiedergabe gestoppt wurde, weil das Ende der Medien erreicht wurde.

Definition von Audioquellen

Schnittstellen, die Audioquellen zur Verwendung in der Web Audio API definieren.

AudioScheduledSourceNode: Der AudioScheduledSourceNode ist eine übergeordnete Schnittstelle für verschiedene Arten von Audioquellknoten-Schnittstellen. Er ist ein AudioNode.
OscillatorNode: Die OscillatorNode-Schnittstelle repräsentiert eine periodische Wellenform, die Sinus, Rechteck, Sägezahn, Dreieck oder benutzerdefiniert sein kann. Es ist ein AudioNode-Audiomodul, das eine gegebene Frequenz von Wellen erzeugt.
AudioBuffer: Die AudioBuffer-Schnittstelle repräsentiert ein kurzes Audio-Asset, das im Speicher residiert, erstellt aus einer Audiodatei mit der Methode BaseAudioContext.decodeAudioData oder mit rohen Daten erstellt mit BaseAudioContext.createBuffer. Einmal in dieser Form dekodiert, kann das Audio dann in einen AudioBufferSourceNode eingefügt werden.
AudioBufferSourceNode: Die AudioBufferSourceNode-Schnittstelle stellt eine Audioquelle dar, die aus im Arbeitsspeicher gespeicherten Audiodaten besteht, die in einem AudioBuffer gespeichert sind. Es ist ein AudioNode, das als Audioquelle fungiert.
MediaElementAudioSourceNode: Die MediaElementAudioSourceNode-Schnittstelle repräsentiert eine Audioquelle, die aus einem HTML-Element <audio> oder <video> besteht. Es ist ein AudioNode, der als Audioquelle fungiert.
MediaStreamAudioSourceNode: Die MediaStreamAudioSourceNode-Schnittstelle repräsentiert eine Audioquelle, die aus einem MediaStream besteht (wie eine Webcam, Mikrofon oder ein Stream, der von einem Remote-Computer gesendet wird). Wenn mehrere Audiotracks im Stream vorhanden sind, wird der Track, dessen id lexikografisch (alphabetisch) zuerst kommt, verwendet. Es ist ein AudioNode, das als Audioquelle fungiert.
MediaStreamTrackAudioSourceNode: Ein Knoten des Typs MediaStreamTrackAudioSourceNode repräsentiert eine Audioquelle, deren Daten von einem MediaStreamTrack stammen. Beim Erstellen des Knotens mit der Methode createMediaStreamTrackSource(), um den Knoten zu erstellen, geben Sie an, welcher Track verwendet werden soll. Dies bietet mehr Kontrolle als MediaStreamAudioSourceNode.

Definition von Audioeffektfiltern

Schnittstellen zur Definition von Effekten, die Sie auf Ihre Audioquellen anwenden möchten.

BiquadFilterNode: Die BiquadFilterNode-Schnittstelle repräsentiert einen einfachen Filter niedriger Ordnung. Es ist ein AudioNode, der verschiedene Arten von Filtern, Klangregelgeräten oder grafische Equalizer darstellen kann. Ein BiquadFilterNode hat immer genau einen Eingang und einen Ausgang.
ConvolverNode: Die ConvolverNode-Schnittstelle ist ein AudioNode, das eine lineare Faltung auf einen gegebenen AudioBuffer durchführt und oft verwendet wird, um einen Halleffekt zu erzielen.
DelayNode: Die DelayNode-Schnittstelle repräsentiert eine Verzögerungslinie; ein AudioNode Audiomodul, das eine Verzögerung zwischen dem Eintreffen von Eingabedaten und ihrer Weiterleitung zum Ausgang verursacht.
DynamicsCompressorNode: Die DynamicsCompressorNode-Schnittstelle bietet einen Kompressionseffekt, der die Lautstärke der lautesten Teile des Signals reduziert, um Verzerrungen und Clipping zu vermeiden, die auftreten können, wenn mehrere Klänge gleichzeitig abgespielt und zusammengeführt werden.
GainNode: Die GainNode-Schnittstelle repräsentiert eine Lautstärkeänderung. Es ist ein AudioNode Audiomodul, das einen gegebenen Gain auf die Eingangsdaten anwendet, bevor es sie an den Ausgang weiterleitet.
WaveShaperNode: Die WaveShaperNode-Schnittstelle repräsentiert einen nichtlinearen Verzerrer. Es ist ein AudioNode, das eine Kurve verwendet, um eine Verformung des Signals durch Wellenformung anzuwenden. Neben offensichtlichen Verzerrungseffekten wird es oft verwendet, um dem Signal ein warmes Gefühl zu verleihen.
PeriodicWave: Beschreibt eine periodische Wellenform, die verwendet werden kann, um die Ausgabe eines OscillatorNode zu formen.
IIRFilterNode: Implementiert einen allgemeinen infinite impulse response (IIR)-Filter; diese Art von Filter kann verwendet werden, um Klangregelgeräte und grafische Equalizer zu implementieren.

Definition von Audiozielen

Nachdem Sie Ihre Audiodaten verarbeitet haben, definieren diese Schnittstellen, wohin sie ausgegeben werden sollen.

AudioDestinationNode: Die AudioDestinationNode-Schnittstelle repräsentiert das Endziel einer Audioquelle in einem gegebenen Kontext – in der Regel die Lautsprecher Ihres Geräts.
MediaStreamAudioDestinationNode: Die MediaStreamAudioDestinationNode-Schnittstelle repräsentiert ein Audioziel, das aus einem WebRTC MediaStream mit einem einzigen AudioMediaStreamTrack besteht, das ähnlich wie ein MediaStream verwendet werden kann, der von getUserMedia() erhalten wird. Es ist ein AudioNode, das als Audioziel fungiert.

Datenanalyse und Visualisierung

Schnittstellen zur Extraktion von Audio-Graph-Statistiken für Datenanalyse und Visualisierung.

AnalyserNode: Repräsentiert einen Knoten, der Echtzeit-Frequenz- und Zeitbereichsanalyseinformationen bereitstellen kann.
AudioPlaybackStats: Bietet Zugriff auf Dauer-, Unterbrechungs- und Latenzstatistiken für den zugehörigen AudioContext. Diese Statistiken ermöglichen es Ihnen, Audioverschiebung und -störungen zu messen.

Splitten und Mergen von Audiokanälen

Um Audiokanäle zu splitten und zu mergen, verwenden Sie diese Schnittstellen.

ChannelSplitterNode: Die ChannelSplitterNode-Schnittstelle trennt die verschiedenen Kanäle einer Audioquelle in eine Reihe von Mono-Ausgängen.
ChannelMergerNode: Die ChannelMergerNode-Schnittstelle vereint verschiedene Mono-Eingänge zu einem einzigen Ausgang. Jeder Eingang wird verwendet, um einen Kanal des Ausgangs zu füllen.

Audio-Räumlichkeit

Diese Schnittstellen ermöglichen es Ihnen, Audioräumlichkeits-Panning-Effekte auf Ihre Audioquellen anzuwenden.

AudioListener: Die AudioListener-Schnittstelle repräsentiert die Position und Ausrichtung der einzigartigen Person, die die Audio-Szene in der Audioräumlichkeit hört.
PannerNode: Die PannerNode-Schnittstelle repräsentiert die Position und das Verhalten eines Audioquellensignals im 3D-Raum und ermöglicht es Ihnen, komplexe Panning-Effekte zu erstellen.
StereoPannerNode: Die StereoPannerNode-Schnittstelle repräsentiert einen einfachen Stereo-Panner-Zweig, der verwendet werden kann, um einen Audiostream nach links oder rechts zu schwenken.

Audiobearbeitung in JavaScript

Mit Audioworklets können Sie benutzerdefinierte Audionodes definieren, die in JavaScript oder WebAssembly geschrieben sind. Audioworklets implementieren die Worklet-Schnittstelle, eine leichtgewichtige Version der Worker-Schnittstelle.

AudioWorklet: Die AudioWorklet-Schnittstelle ist über das AudioContext-Objekt audioWorklet verfügbar und ermöglicht das Hinzufügen von Modulen zum Audioworklet, die außerhalb des Haupt-Threads ausgeführt werden.
AudioWorkletNode: Die AudioWorkletNode-Schnittstelle repräsentiert einen AudioNode, der in einen Audiographen eingebettet ist und Nachrichten an den entsprechenden AudioWorkletProcessor senden kann.
AudioWorkletProcessor: Die AudioWorkletProcessor-Schnittstelle repräsentiert Audiobearbeitungscode, der im AudioWorkletGlobalScope ausgeführt wird und Audio direkt generieren, verarbeiten oder analysieren kann und Nachrichten an den entsprechenden AudioWorkletNode senden kann.
AudioWorkletGlobalScope: Die AudioWorkletGlobalScope-Schnittstelle ist ein WorkletGlobalScope-abgeleitetes Objekt, das einen Arbeitskontext repräsentiert, in dem ein Audiobearbeitungsskript ausgeführt wird; es ist so konzipiert, dass es die Erzeugung, Verarbeitung und Analyse von Audiodaten direkt mit JavaScript in einem Worklet-Thread und nicht im Main-Thread ermöglicht.

Veraltet: Script-Prozessor-Nodes

Bevor Audioworklets definiert wurden, nutzte die Web Audio API den ScriptProcessorNode für JavaScript-basierte Audiobearbeitung. Da der Code im Haupt-Thread ausgeführt wird, haben sie schlechte Leistung. Der ScriptProcessorNode wird aus historischen Gründen beibehalten, ist aber als veraltet markiert.

ScriptProcessorNode: Die ScriptProcessorNode-Schnittstelle ermöglicht die Erzeugung, Verarbeitung oder Analyse von Audio mit JavaScript. Es ist ein AudioNode Audiobearbeitungsmodul, das mit zwei Puffern verbunden ist, einem, der die aktuelle Eingabe enthält, und einem, der die Ausgabe enthält. Ein Ereignis, das die AudioProcessingEvent-Schnittstelle implementiert, wird an das Objekt gesendet, sobald der Eingabepuffer neue Daten enthält, und der Ereignishandler endet, wenn er den Ausgabepuffer mit Daten gefüllt hat.
audioprocess (Ereignis): Das audioprocess-Ereignis wird ausgelöst, wenn ein Eingabepuffer eines Web Audio API ScriptProcessorNode zur Verarbeitung bereit ist.
AudioProcessingEvent: Das AudioProcessingEvent repräsentiert Ereignisse, die auftreten, wenn ein ScriptProcessorNode-Eingabepuffer zur Verarbeitung bereit ist.

Offline-/Hintergrund-Audiobearbeitung

Es ist möglich, einen Audiographen sehr schnell im Hintergrund zu verarbeiten/rendern — ihn in einen AudioBuffer zu rendern, anstatt auf die Geräte-Lautsprecher — mit dem Folgenden.

OfflineAudioContext: Die OfflineAudioContext-Schnittstelle ist eine AudioContext-Schnittstelle, die einen Audiographen repräsentiert, der aus verknüpften AudioNodes besteht. Im Gegensatz zu einem Standard-AudioContext rendert ein OfflineAudioContext das Audio nicht wirklich, sondern erzeugt es so schnell wie möglich in einem Puffer.
complete (Ereignis): Das complete-Ereignis wird ausgelöst, wenn das Rendering eines OfflineAudioContext beendet ist.
OfflineAudioCompletionEvent: Das OfflineAudioCompletionEvent repräsentiert Ereignisse, die auftreten, wenn die Verarbeitung eines OfflineAudioContext beendet ist. Das complete-Ereignis verwendet diese Schnittstelle.

Leitfäden und Tutorials

Beispiel und Tutorial: Einfaches Synthesizer-Keyboard: Dieser Artikel präsentiert den Code und eine funktionierende Demo eines Video-Keyboards, das Sie mit der Maus spielen können. Das Keyboard ermöglicht das Umschalten zwischen den Standard-Wellenformen sowie einer benutzerdefinierten Wellenform. Sie können die Hauptverstärkung mit einem Lautstärkeregler unter dem Keyboard steuern. Dieses Beispiel nutzt die folgenden Web-API-Schnittstellen: AudioContext, OscillatorNode, PeriodicWave und GainNode.
Fortgeschrittene Techniken: Erstellen und Sequenzieren von Audio: In diesem Tutorial werden wir die Erstellung und Modifikation von Sound sowie Timing und Planung behandeln. Wir werden Probenladen, Hüllkurven, Filter, Wavetables und Frequenzmodulation einführen. Wenn Sie mit diesen Begriffen vertraut sind und nach einer Einführung in ihre Anwendung mit der Web Audio API suchen, sind Sie hier genau richtig.
Grundkonzepte hinter der Web Audio API: Dieser Artikel erklärt einige der Audiotheorien, welche die Funktionsweise der Web Audio API-Features betreffen, um Ihnen zu helfen, informierte Entscheidungen bei der Gestaltung der Audioverwaltung in Ihrer App zu treffen. Wenn Sie kein Tontechniker sind, bietet dieser Artikel genügend Hintergrundinformationen, um zu verstehen, warum die Web Audio API so funktioniert, wie sie es tut.
Grundlagen der räumlichen Audiowiedergabe im Web: Als wäre die umfangreiche Vielfalt an Klangbearbeitungsoptionen der Web Audio API nicht schon genug, bietet sie auch Einrichtungen, um die Veränderung des Klangs zu simulieren, wenn ein Hörer sich um eine Tonquelle bewegt, zum Beispiel das Panning, wenn Sie sich in einem 3D-Spiel um eine Tonquelle bewegen. Der offizielle Begriff dafür ist räumliche Audioverarbeitung, und dieser Artikel behandelt die Grundlagen der Implementierung eines solchen Systems.
Hintergrund-Audiobearbeitung mit AudioWorklet: Dieser Artikel erklärt, wie Sie einen Audio-Worklet-Prozessor erstellen und in einer Web-Audio-Anwendung verwenden können.
Steuerung mehrerer Parameter mit ConstantSourceNode: Dieser Artikel demonstriert, wie Sie einen ConstantSourceNode verwenden können, um mehrere Parameter so zu verknüpfen, dass sie denselben Wert teilen, welcher durch das Setzen des ConstantSourceNode.offset Parameters geändert werden kann.
Verwendung der Web Audio API: Lassen Sie uns einen Blick darauf werfen, wie man mit der Web Audio API anfängt. Wir werden kurz einige Konzepte betrachten und dann ein einfaches Boombox-Beispiel studieren, das es uns ermöglicht, einen Audiotrack zu laden, ihn abzuspielen, zu pausieren und seine Lautstärke sowie das Stereo-Panning zu ändern.
Verwendung von IIR-Filtern: Die IIRFilterNode-Schnittstelle der Web Audio API ist ein AudioNode-Prozessor, der einen allgemeinen Infinite Impulse Response (IIR) Filter implementiert. Dieser Filtertyp kann zur Implementierung von Klangregelgeräten und grafischen Equalizern verwendet werden. Die Filterantwortparameter können spezifiziert werden, sodass er nach Bedarf abgestimmt werden kann. Dieser Artikel erklärt, wie man einen solchen Filter implementiert und in einem einfachen Beispiel verwendet.
Visualisierungen mit Web Audio API: Eine der interessantesten Funktionen der Web Audio API ist die Möglichkeit, Frequenz-, Wellenform- und andere Daten von Ihrer Audioquelle zu extrahieren, die dann zur Erstellung von Visualisierungen verwendet werden können. Dieser Artikel erklärt, wie das geht, und bietet einige grundlegende Anwendungsbeispiele.
Web Audio API Best Practices: Es gibt kein strikt richtiges oder falsches Vorgehen beim Schreiben von kreativem Code. Solange Sie Sicherheit, Leistung und Zugänglichkeit berücksichtigen, können Sie sich Ihren eigenen Stil aneignen. In diesem Artikel teilen wir eine Reihe von Best Practices — Richtlinien, Tipps und Tricks für die Arbeit mit der Web Audio API.

Beispiele

Sie finden eine Reihe von Beispielen in unserem webaudio-examples Repo auf GitHub.

Spezifikationen

Spezifikation
Web Audio API # AudioContext

Tone.js: ein Framework, um interaktive Musik im Browser zu erstellen.
howler.js: eine JS-Audiobibliothek, die standardmäßig die Web Audio API verwendet und auf HTML Audio zurückgreift, sowie andere nützliche Funktionen bietet.
Mooog: jQuery-ähnliches Verkettung von AudioNodes, Mixer-ähnliche Send/Returns und mehr.
XSound: Web Audio API-Bibliothek für Synthesizer, Effekte, Visualisierungen, Aufnahmen, usw.
OpenLang: HTML-Video-Themensprachenlabor-Webanwendung, die die Web Audio API verwendet, um Video- und Audioaufnahmen von verschiedenen Quellen zu einer einzigen Datei zu kombinieren (Quelle auf GitHub)
Pts.js: Vereinfacht die Web-Audio-Visualisierung (Leitfaden)

Help improve MDN

Erfahren Sie, wie Sie beitragen können Diese Seite wurde automatisch aus dem Englischen übersetzt.

Übersetzung auf GitHub anzeigen • Fehler mit dieser Übersetzung melden