AudioWorkletNode.port
Experimental: This is an experimental technology
Check the Browser compatibility table carefully before using this in production.
AudioWorkletNode
인터페이스의 읽기 전용 port
속성은 연관된 MessagePort
(en-US)를 반환합니다. 이것은 노드와 노드에 연관된 AudioWorkletProcessor
사이에서 소통하기 위해 사용될 수 있습니다.
참고: 채널의 다른 쪽 끝에 있는 포트는
프로세서의 port
속성 아래에서
사용 가능합니다.
구문
audioWorkletNodeInstance.port;
값
AudioWorkletNode
와 이것에 연관된 AudioWorkletProcessor
를 연결하는 MessagePort
(en-US) 객체.
예제
양방향 소통 능력을 시연하기 위해서, 우리는 AudioWorkletProcessor
를 생성할 것인데, 이는 무음을 출력하고 이것의 AudioWorkletNode
으로부터의 핑 요청에 응답할 것입니다.
우선, 우리는 커스텀 AudioWorkletProcessor
를 정의하고, 등록할 필요가 있습니다. 이 작업은 별도의 파일에서 이루어져야 함에 주의하세요.
// 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
의 인스턴스를 생성하고, 노드를 오디오 그래프에 연결할 것입니다.
const audioContext = new AudioContext()
await audioContext.audioWorklet.addModule('ping-pong-processor.js')
const pingPongNode = new AudioWorkletNode(audioContext, 'ping-pong-processor')
// 매 초 AudioWorkletNode로부터
// AudioWorkletProcessor에 'ping' 문자열을 포함하는 메시지를 보냅니다
setInterval(() => pingPongNode.port.postMessage('ping'), 1000)
pingPongNode.port.onmessage = (e) => console.log(e.data)
pingPongNode.connect(audioContext.destination)
이것은 "ping"
과 "pong"
문자열을 콘솔에 매 초 출력할 것입니다.
명세
Specification |
---|
Web Audio API # dom-audioworkletnode-port |
브라우저 호환성
BCD tables only load in the browser