0

I am new to TypeScript, and the whole JavaScript environment in general. I have a small project to do, which requires creating a browser application with TypeScript (I don't have any code yet).

I need to record raw PCM audio from the browser microphone, log it, and play the same PCM audio back through browser speakers.

I have looked into using MediaRecorder for recording, and using the plain HTMLAudioElement for playback, but i'm not sure if they support RAW audio. I also some posts mentioning to use AudioContext ScriptProcessorNode to obtain raw audio, but i have no idea how to play them back.

I do not need completed solutions, but would appreciate any pointers or tutorials that would help me get this done.

4

1 回答 1

1

我确实在一个名为可扩展媒体记录器的小库上工作,它允许使用自定义编码器扩展本机 MediaRecorder。我构建的概念验证编码器是 WAV 编码器。它希望这也适用于你。

我还没有记录这个库,这就是为什么我很高兴把你的问题作为一个机会来整理一个完整的使用示例。

import { MediaRecorder, register } from 'extendable-media-recorder';
import { connect } from 'extendable-media-recorder-wav-encoder';

(async () => {
    // Get the port a worker which can encode WAV files.
    const port = await connect();
    // Register this port with the MediaRecorder.
    await register(port);
    // Request a MediaStream with an audio track.
    const mediaStream = await navigator.mediaDevices
        .getUserMedia({ audio: true });
    // Create a MediaRecorder instance with the newly obtained MediaStream.
    const mediaRecorder = new MediaRecorder(mediaStream, {
        mimeType: 'audio/wav'
    });

    // Kick off the recording.
    mediaRecorder.start();

    mediaRecorder.addEventListener('dataavailable', ({ data }) => {
        // The data variable now holds a refrence to a Blob with the WAV file.
    });

    // Stop the recording after a second.
    setTimeout(() => mediaRecorder.stop(), 1000);
})();

我希望评论能解释代码的作用。请让我知道,如果不是这样。

于 2019-06-05T02:44:41.213 回答