실시간 웹 오디오 입력 사용 설정됨

Chris Wilson
Chris Wilson

어제의 Chrome Canary 빌드 (23.0.1270.0)에 도입된 새로운 기능, 즉 OSX에서 마이크 또는 기타 오디오 입력의 실시간 오디오에 지연 시간이 짧은 방식으로 액세스할 수 있는 기능이 정말 기대됩니다. (Windows에서는 아직 사용 설정되지 않았지만 걱정하지 마세요. 현재 준비 중입니다.)

이를 사용 설정하려면 chrome://flags/로 이동하여 하단에 있는 'Web Audio Input' 항목을 사용 설정하고 브라우저를 다시 실행해야 합니다. 이제 시작할 준비가 되었습니다.

실시간 입력 시각화 도구를 사용하여 입력의 스펙트럼을 확인하여 실시간 오디오 입력을 테스트할 수 있습니다.

이러한 웹 오디오 코더를 위해 오디오 입력 스트림을 요청하고 원하는 처리 그래프에 연결할 노드를 가져오는 방법은 다음과 같습니다.

// success callback when requesting audio input stream
function gotStream(stream) {
    window.AudioContext = window.AudioContext || window.webkitAudioContext;
    var audioContext = new AudioContext();

    // Create an AudioNode from the stream.
    var mediaStreamSource = audioContext.createMediaStreamSource( stream );

    // Connect it to the destination to hear yourself (or any other node for processing!)
    mediaStreamSource.connect( audioContext.destination );
}

navigator.getUserMedia = navigator.getUserMedia || navigator.webkitGetUserMedia;
navigator.getUserMedia( {audio:true}, gotStream );

특히 음악 분야에서는 지연 시간이 짧은 오디오 입력에 다양한 가능성이 있습니다. 제가 준비한 간단한 음높이 감지기에서 이 기능을 사용하는 간단한 예를 확인하실 수 있습니다. 기타를 꽂거나 마이크에 대고 휘파람을 불어 보세요.

약속드린 대로 Google IO용으로 작성한 Vocoder에 라이브 오디오를 입력 소스로 추가했습니다. 모듈레이터에서 '라이브 입력'을 선택하기만 하면 됩니다. 변조기 게인과 신스 레벨을 조정해야 할 수 있습니다. 입력 지연이 아닌 처리로 인해 약간의 지연이 발생합니다. 이제 실시간 오디오 입력이 있으므로 다시 한번 조정해 보겠습니다.

마지막으로 웹 오디오 데모 모음을 살펴보세요. 이 글을 읽을 때쯤에는 라이브 오디오 데모가 더 추가될 수도 있습니다.