1. 開発者向けのウェブ技術
  2. Web API
  3. AudioWorkletNode
  4. AudioWorkletNode: port プロパティ

このページはコミュニティーの尽力で英語から翻訳されました。MDN Web Docs コミュニティーについてもっと知り、仲間になるにはこちらから。

View in English Always switch to English

AudioWorkletNode: port プロパティ

Baseline 広く利用可能

この機能は広く実装されており、多くのバージョンの端末やブラウザーで動作します。2021年4月以降、すべてのブラウザーで利用可能です。

AudioWorkletNode インターフェイスの読み取り専用プロパティ port は、関連付けられた MessagePort を返します。これにより、ノードと対応する AudioWorkletProcessor の間で双方向通信ができます。

メモ: チャネルのもう一方の端にあるポートは、処理器の port プロパティから参照できます。

この AudioWorkletNode と対応する AudioWorkletProcessor を繋ぐ MessagePort オブジェクトです。

双方向通信でできることのデモのため、無音を出力し、AudioWorkletNode からの ping 要求に応える AudioWorkletProcessor を作成します。

まず、独自の AudioWorkletProcessor を定義し、登録します。 これは別のファイルで行うことに注意してください。

js
// ping-pong-processor.js
class PingPongProcessor extends AudioWorkletProcessor {
 constructor(...args) {
 super(...args);
 this.port.onmessage = (e) => {
 console.log(e.data);
 this.port.postMessage("pong");
 };
 }
 process(inputs, outputs, parameters) {
 return true;
 }
}
registerProcessor("ping-pong-processor", PingPongProcessor);

そして、メインスクリプトファイルで処理器をロードし、処理器の名前を渡して AudioWorkletNode のインスタンスを作成し、このノードを音声グラフに接続します。

js
const audioContext = new AudioContext();
await audioContext.audioWorklet.addModule("ping-pong-processor.js");
const pingPongNode = new AudioWorkletNode(audioContext, "ping-pong-processor");
// 毎秒、AudioWorkletNode から
// 文字列 'ping' が入ったメッセージを AudioWorkletProcessor に送る
setInterval(() => pingPongNode.port.postMessage("ping"), 1000);
pingPongNode.port.onmessage = (e) => console.log(e.data);
pingPongNode.connect(audioContext.destination);

このプログラムは、コンソールに毎秒文字列 "ping""pong" を出力します。

仕様書

仕様書
Web Audio API
# dom-audioworkletnode-port

ブラウザーの互換性

関連情報

MDN の改良に協力

協力方法を知る

このページは MDN の貢献者によって に最終更新されました。

AltStyle によって変換されたページ (->オリジナル) /