html录音完全依赖mediastream，无流则mediarecorder无法初始化；必须传有效mediastream实例，禁止传null/undefined/srcobject未赋值对象；需手动stop轨道、验证音频轨道存在、避免clone复用，并注意web audio中转及跨浏览器兼容限制。
HTML录音本身不“配合”媒体流，而是完全依赖 MediaStream 才能工作——没有它，MediaRecorder 根本无法初始化，调用 start() 会直接抛 InvalidStateError。
MediaRecorder 构造必须传 MediaStream 实例
MediaRecorder 的第一个参数强制要求是有效的 MediaStream 对象，不能是 HTMLAudioElement、Blob、ArrayBuffer，也不能是未赋值的 srcObject。
- 常见错误：写成
new MediaRecorder(videoEl.srcObject)却没检查videoEl.srcObject是否已存在 → 流为null或undefined，报TypeError: Failed to construct 'MediaRecorder': parameter 1 is not of type 'MediaStream' - 来自
getUserMedia()的流最可靠：const stream = await navigator.mediaDevices.getUserMedia({ audio: true }) - 来自
captureStream()的流有严重兼容限制：Safari 16.4+ 才支持video.captureStream()，iOS Safari 仍不支持音频捕获 - 务必验证轨道有效性：
if (stream.getAudioTracks().length === 0) { /* 静音或无音频，录制将无声 */ }
流生命周期必须手动管理，否则麦克风一直开着
MediaRecorder 持有 MediaStream 引用期间，麦克风/摄像头设备持续占用，系统指示灯常亮，且下次 getUserMedia() 可能失败或返回静音流。
-
mediaRecorder.stop()不会自动停止轨道，必须显式调用：stream.getTracks().forEach(track => track.stop()) - 忘记这步 → 页面后台运行时麦克风仍在采集，耗电、隐私风险、后续授权失败
- 不要用
stream.clone()试图复用：克隆流与原始流共享底层轨道，原始流stop()后克隆流也失效 - 每次新录制前，建议先检查
mediaRecorder.state；若不是"inactive"，应new MediaRecorder(stream)创建新实例
Web Audio 处理媒体流需中转节点，Safari 支持有限
若想在录音前加降噪、增益、AGC 等处理，必须走 Web Audio API，并通过 MediaStreamAudioDestinationNode 把处理后的音频导出为新流，再喂给 MediaRecorder。
- 典型链路：
MediaStreamSource → GainNode → AnalyserNode → MediaStreamAudioDestinationNode → new MediaRecorder(destinationNode.stream) - Safari 对
MediaStreamAudioDestinationNode支持不稳定，部分版本静音或报NotSupportedError - 移动端 iOS 上几乎无法绕过限制获取系统播放音（如网页背景音乐），
captureStream()不可用，这是架构级限制，不是代码能补的 - 增益控制可缓解系统音量衰减问题：
gainNode.gain.value = 1.0，但仅对 Web Audio 输出路径有效，不影响MediaRecorder原始编码
分段录制别靠单个 MediaRecorder 调 start()/stop()
长时间连续录音时，反复对同一 MediaRecorder 实例调用 start()/stop() 容易触发状态异常，尤其在低端安卓机上出现断点或 dataavailable 漏发。
- 更稳妥做法：每段用独立
MediaRecorder实例，配合时间戳对齐，避免状态污染 - 分片间隔建议 ≥ 1000ms；设太小（如 100ms）在部分机型上导致频繁触发
dataavailable，CPU 压力大且易丢帧 - 每段生成的
Blob要及时用URL.revokeObjectURL()清理，否则内存泄漏明显 - 注意 MIME 类型兼容性：
audio/webm;codecs=opus兼容性最好；audio/mp4在 Safari 可用，但 Android Chrome 不支持 AAC 编码的 MP4 录制
真正麻烦的从来不是怎么写那几行 start() 和 stop()，而是不同来源的 MediaStream 在时间戳精度、轨道同步性、跨浏览器行为上的差异——这些在开发阶段很难暴露，往往上线后才在特定机型上突然崩掉。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
