WebAudio PCM 采集与 WAV 封装保存实践

概述WebAudio 可从麦克风采集 PCM。本文示例封装 WAV 头并保存。采集与封装async function capturePCM() { const stream = await navigator.mediaDevices.getUserMedia({ audio: true }); const ctx = new AudioContext(); const src = ctx.createMediaStreamSource(stream); const processor = ctx.createScriptProcessor(4096, 1, 1); const chunks = []; processor.onaudioprocess = e => { const data = e.inputBuffer.getChannelData(0); chunks.push(Float32Array.from(data)); }; src.connect(processor); processor.connect(ctx.destination); return { stop: async () => { processor.disconnect(); src.disconnect(); stream.getTracks().forEach(t => t.stop()); return chunks; } }; } function pcmToWav(floatChunks, sampleRate = 44100) { const samples = Float32Array.from(floatChunks.reduce((a,c) => a.concat(Array.from(c)), [])); const buf = new ArrayBuffer(44 + samples.length * 2); const view = new DataView(buf); const writeStr = (off, s) => { for (let i=0;i<s.length;i++) view.setUint8(off+i, s.charCodeAt(i)); }; writeStr(0, 'RIFF'); view.setUint32(4, 36 + samples.length * 2, true); writeStr(8, 'WAVE'); writeStr(12, 'fmt '); view.setUint32(16, 16, true); view.setUint16(20, 1, true); view.setUint16(22, 1, true); view.setUint32(24, sampleRate, true); view.setUint32(28, sampleRate * 2, true); view.setUint16(32, 2, true); view.setUint16(34, 16, true); writeStr(36, 'data'); view.setUint32(40, samples.length * 2, true); let off = 44; for (let i=0;i<samples.length;i++) { const s = Math.max(-1, Math.min(1, samples[i])); view.setInt16(off, s < 0 ? s * 0x8000 : s * 0x7FFF, true); off += 2; } return new Blob([buf], { type: 'audio/wav' }); }