Web Audio API
Experimental
這是一個實驗中的功能
此功能在某些瀏覽器尚在開發中,請參考兼容表格以得到不同瀏覽器用的前輟。
Web Audio API 可於 Web App 或網頁上操作並播放音訊檔案。
Web Audio API 是根據模組化路由 (Modular routing) 的概念所設計。所謂的模組化路由,即是以「音訊節點 (Audio nodes)」執行基本的音訊作業,節點又互相連接而構成「音訊路由圖 (Audio routing graphs)」。在同一環境 (Audio context) 內,又可支援數個音源與多樣的聲道配置。此模組化設計可提供更高的靈活度,並能建立複雜的音訊函式與動態效果。
音訊節點均透過其輸出與輸入而相互連結。各個輸入/輸出均具備數個聲道 (Channel),以構成特定的音訊配置。但目前已可支援單聲道、立體聲、四聲道、5.1 聲道等配置,並支援其他的離散配置。
音訊有多種來源。可能由特定的音訊節點 (如震盪器、自訂函式,甚或簡易的資料陣列) 直接在 JavaScript 中產生。音源除了可連至 HTML 媒體元素 (如 <video>
或 <audio>
),亦可能來自於 WebRTC 的 MediaStream
(本端裝置的相機或遠方電腦)。
特定音訊事件發生的時間點,均達到極高的精確度與極低的潛時,因此亦可用以詳細定義鼓類機器或音序器 (Sequencer) 所需的事件。
Web Audio API 亦可控制音訊的空間定位 (Spatialized) 作業:透過 source-listener 模型架構的系統,進而控制所要使用的左右相位 (Panning,聲音放置於左右喇叭之間形成的立體音場中,以產生出空間感) 模型,進而自動處理因距離遠近所產生的衰減,或是由於音源/聽者移動所發生的都卜勒移頻 (Doppler shift)。
參考
AnalyserNode
AudioBuffer
(en-US)AudioBufferSourceNode
(en-US)AudioContext
(en-US)AudioDestinationNode
(en-US)AudioListener
(en-US)AudioNode
(en-US)AudioParam
(en-US)audioprocess (en-US)
(event)AudioProcessingEvent
(en-US)BiquadFilterNode
(en-US)ChannelMergerNode
(en-US)ChannelSplitterNode
(en-US)complete (en-US)
(event)ConvolverNode
(en-US)DelayNode
(en-US)DynamicsCompressorNode
(en-US)ended (en-US)
(event)GainNode
MediaElementAudioSourceNode
(en-US)MediaStreamAudioDestinationNode
(en-US)MediaStreamAudioSourceNode
(en-US)OfflineAudioCompletionEvent
(en-US)OfflineAudioContext
(en-US)OscillatorNode
(en-US)PannerNode
(en-US)ScriptProcessorNode
(en-US)WaveShaperNode
(en-US)
線上教學
- 使用 Web Audio API
- Getting Started with the Web Audio API (僅說明 WebKit-only 的非標準建置)
- 混合定位音訊 (Positional Audio) 與 WebGL
- 以 Web Audio API 開發遊戲音訊
- 將 webkitAudioContext 程式碼移植為標準的 AudioContext
規格
Specification | Status | Comment |
---|---|---|
Web Audio API | Working Draft |
瀏覽器相容性
Feature | Chrome | Firefox (Gecko) | Internet Explorer | Opera | Safari (WebKit) |
---|---|---|---|---|---|
Basic support | 14 webkit (en-US) | 23 | No support | 15 webkit (en-US) | 6 webkit (en-US) |
Feature | Android | Chrome | Firefox Mobile (Gecko) | IE Phone | Opera Mobile | Safari Mobile |
---|---|---|---|---|---|---|
Basic support | No support | 28 webkit (en-US) | No support | No support | No support | 6 webkit (en-US) |