音频在部分浏览器不响的根本原因是格式fallback缺失、type错误或服务器未配mime类型；必须用+双格式兜底，配对服务器mime，且由用户手势触发play()。
音频在部分浏览器或设备上完全不响，不是代码写错了，而是浏览器直接跳过了解码流程——根本原因通常是格式 fallback 缺失、type 写错，或服务器没配 MIME 类型。
为什么只写 src 属性大概率失败
单靠 <audio src="a.mp3"></audio> 等于把播放权交给浏览器掷骰子：Safari（尤其 iOS）会静默跳过，Firefox 可能加载但不触发 canplay，Android 旧 WebView 甚至返回 duration = NaN。浏览器不会报错，只会沉默。
-
type属性不可省：必须显式声明type="audio/mpeg"，type="audio/mp3"是错的，浏览器不识别 - 多个
<source></source>标签必须按兼容性从高到低排列：MP3 放最前，OGG 次之，WAV 仅作短提示音兜底 - 不要用 JS 动态插入
<source></source>后再调load()—— iOS Safari 不认这种“非初始 DOM”加载
MEDIA_ERR_SRC_NOT_SUPPORTED（code: 4）意味着什么
控制台出现这个错误，说明音频文件已成功下载（Network 面板里状态是 200），但浏览器打开后当场判了死刑：解码器不支持该编码组合。这不是路径问题，也不是网络问题。
- 用
ffprobe your-audio.mp3查真实编码，重点看输出中类似Audio: mp3 (mp3), 44100 Hz, stereo, fltp的字段 ——fltp（浮点）编码在 Safari 上极易被拒 - 最稳的落地组合只有两个：
<source src="a.mp3" type="audio/mpeg"></source>+<source src="a.ogg" type="audio/ogg"></source> - OGG 文件必须用 Vorbis 编码（不是 Opus），用
ffprobe a.ogg确认输出含Audio: vorbis
本地开发时音频加载被 Chrome 直接封禁
双击 HTML 文件用 file:// 协议打开，Chrome 和新版 Firefox 会彻底禁用音频加载（连 play() 都抛 DOMException），这不是 bug，是策略硬限制。
- 必须起本地 HTTP 服务：终端运行
python3 -m http.server 8000，然后访问http://localhost:8000 - 检查 Network 面板里音频请求的响应头，确认
Content-Type是audio/mpeg或audio/ogg，不是text/plain或空着 - Apache 用户在
.htaccess加：AddType audio/mpeg .mp3；Nginx 用户在types块加：audio/mpeg mp3;
autoplay 失效不是因为你没写对，而是浏览器在等“动手”
写了 autoplay muted 还没声音？不是 JS 错了，是页面还没拿到用户手势授权。iOS Safari 更狠：即使点过按钮，如果 <audio></audio> 元素被 display: none 或 opacity: 0 遮挡，依然静音。
- 删掉
autoplay属性，改用按钮绑定：document.querySelector('button').addEventListener('click', () => audio.play().catch(e => {})) - 确保首次
play()调用发生在用户事件回调内，且只执行一次（加{ once: true }） - iOS 上避免在
canplay或loadedmetadata回调里设currentTime后立刻play()—— 它不认这种“伪手动”上下文
真正麻烦的从来不是写几行 HTML，而是每个环节都得对齐：文件编码、type 字符串、服务器响应头、用户交互时机、移动端渲染状态——漏掉任意一环，音频就归零。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
