js mediarecorder

// 使用 MediaRecorder API 录制音频或视频的示例代码

// 1. 请求媒体设备权限（例如麦克风或摄像头）
async function startRecording() {
    try {
        // 请求访问用户的媒体设备（例如摄像头和麦克风）
        const stream = await navigator.mediaDevices.getUserMedia({ audio: true, video: false });

        // 2. 创建一个新的 MediaRecorder 实例
        const mediaRecorder = new MediaRecorder(stream);

        // 3. 定义数据可用时的处理函数
        let chunks = [];
        mediaRecorder.ondataavailable = event => {
            if (event.data.size > 0) {
                chunks.push(event.data);
            }
        };

        // 4. 定义录制结束时的处理函数
        mediaRecorder.onstop = () => {
            const blob = new Blob(chunks, { type: 'audio/wav' }); // 将录制的数据合并为一个 Blob 对象
            const audioUrl = URL.createObjectURL(blob); // 创建一个指向 Blob 的 URL
            const audio = new Audio(audioUrl); // 创建一个新的音频对象
            audio.play(); // 播放录制的音频
            chunks = []; // 清空 chunks 数组
        };

        // 5. 开始录制
        mediaRecorder.start();
        console.log('开始录制...');

        // 6. 录制 5 秒后停止
        setTimeout(() => {
            mediaRecorder.stop();
            console.log('停止录制');
        }, 5000);

    } catch (error) {
        console.error('无法获取媒体流:', error);
    }
}

// 调用函数开始录制
startRecording();

解释说明：

• navigator.mediaDevices.getUserMedia()：请求访问用户的媒体设备（如麦克风或摄像头）。在这个例子中，我们只请求了音频权限。
• new MediaRecorder(stream)：创建一个 MediaRecorder 实例，用于录制来自媒体流的数据。
• mediaRecorder.ondataavailable：当录制的数据块可用时触发，将数据块存储在 chunks 数组中。
• mediaRecorder.onstop：当录制结束时触发，将所有录制的数据块合并为一个 Blob 对象，并生成一个可播放的音频文件。
• mediaRecorder.start()：开始录制。
• setTimeout()：设置定时器，在 5 秒后自动停止录制。