網路音訊常見問題

Boris Smus

過去幾個月來,WebKit Web Audio API 已成為引人入勝的網路遊戲和音訊應用程式平台。隨著開發人員熟悉這些產品,我不斷聽到類似問題。本次快速更新旨在解決部分常見問題,讓你的 Web Audio API 使用體驗更愉快。

問:我不能發出音效,該怎麼辦?

答:如果你是第一次使用 Web Audio API,請參閱入門教學課程或 Eric 的根據使用者互動方式播放音訊食譜。

問:我該擁有多少音訊背景資訊?

答:一般而言,每個網頁都應有一個 AudioContext,且單一音訊內容可以支援多個與該內容相連結的節點。雖然您可以在單一網頁上加入多個 AudioContext,但這也可能導致成效下滑。

問:我剛剛有播放 noteOn() 的 AudioBufferSourceNode,想再玩一次,但noteOn()沒有執行任何動作!該怎麼辦?

答:來源節點一旦播放完畢,就無法再播放其他內容。如要再次播放基礎緩衝區,您必須建立新的 AudioBufferSourceNode 並呼叫 noteOn()

雖然重新建立來源節點可能效率不彰,但來源節點已針對這種模式大幅最佳化。此外,如果你保留 AudioBuffer 的帳號代碼,則不必再次要求資產播放相同音效。如果您需要重複此模式,請使用 playSound(buffer)簡單的輔助函式來封裝播放內容。

問:在播放音效時,為何每次都必須建立新的來源節點?

答:這個架構的概念是將音訊資產與播放狀態分離。緩衝區類似於唱片播放器,與錄音和來源類似。由於許多應用程式會同時播放相同緩衝區的多個版本,因此這個模式至關重要。

問:如何處理來自 audiovideo 標記的音效?

答:MediaElementAudioSourceNode 正在進行中!在適用情況下,運作方式大致如下 (為透過音訊標記播放的範例加入濾鏡效果):

<audio src="sounds/sample.wav" controls>
var audioElement = document.querySelector('audio');
var mediaSourceNode = context.createMediaElementSource(audioElement);
mediaSourceNode.connect(filter);
filter.connect(context.destination);

這項錯誤會追蹤這項功能。請注意,在這項設定中,您不需要呼叫 mediaSourceNode.noteOn(),音訊標記會控製播放作業。

問:何時可以聽到麥克風的聲音?

答:這部分的音訊輸入部分會在 WebRTC 中導入,使用 getUserMedia 做為特殊來源節點。將和 createMediaElementSource 搭配運作。

問:如何檢查 AudioSourceNode 的播放進度?

答:由於 Web Audio API 不支援這項功能,因此您必須使用 JavaScript 計時器。以下是開始使用 Web Audio API 教學課程中的程式碼片段範例:

// Assume source and buffer are previously defined.
source.noteOn(0);
var timer = setTimeout(function() {
    console.log('playback finished');
}, buffer.duration * 1000);

有一個尚未解決的錯誤,導致 Web Audio API 實作更準確的回呼。

問:載入音效會導致整個 UI 執行緒上鎖,且我的 UI 沒有回應,救命!**

答:使用 decodeAudioData API 進行非同步載入,避免封鎖主執行緒。請參閱這個範例

問:使用 Web Audio API 時,音訊處理速度是否能比即時時間更快?

答:是,我們正在設法解決這個問題。敬請密切關注!

問:我開發了一款出色的 Web Audio API 應用程式,但每當應用程式在背景中執行的分頁在背景執行時,聽起來都很奇怪!

答:可能是因為你使用的是 setTimeouts,如果頁面是於背景執行,運作方式會有所不同。未來,Web Audio API 將可使用網路音訊的內部計時器 (context.currentTime 屬性),在特定時間回呼。如需詳細資訊,請參閱這項功能要求

一般來說,應用程式進入背景時最好停止播放。您可以使用 Page Visibility API 來偵測網頁何時進入背景。

問:如何使用 Web Audio API 變更音效的音調?

A:變更來源節點上的 playbackRate

問:我可以在不變更速度的情況下變更音調嗎?

答:Web Audio API 可在音訊環境中包含 PitchNode,但很難實作。這是因為音訊社群沒有直接的音調轉移演算法。已知的技巧會產生不連貫的情況,尤其是在音調變化很大的情況下。解決這個問題的方法有兩種:

  • 時間網域演算法,這會造成重複片段回音。
  • 頻率域技術,避免產生聲響。

雖然沒有可執行這些技術的原生節點,但是您可以使用 JavaScriptAudioNode 執行此操作。這個程式碼片段可能會做為起點,

問:如何以我選擇的取樣率建立 AudioContext?

答:我們目前不支援這項功能,但我們正進行研究。請參閱這項功能要求

如有其他問題,歡迎在 StackOverflow 上使用 web-audio 標記提問。