结论：仅写 无法保证播放，必须配合 MIME 类型校验、用户手势触发及多格式 fallback；浏览器严格依据 Content-Type 响应头解码，本地 file:// 协议下常因 text/plain 被忽略，需起服务器并确保响应头为 audio/mpeg； 必须正确声明 type（如 audio/mpeg），顺序推荐 mp3→ogg→wav；autoplay 需 muted 且仍受 iOS 限制；play() 必须由用户手势触发并处理 Promise 拒绝；currentTime 和 ended 事件需在 loadedmetadata 后操作，iOS 上 ended 不可靠，建议用 timeupdate 判断结束。
直接说结论：不靠多格式 fallback + 用户手势触发 + MIME 类型校验，光写 就算路径全对，也大概率在 Safari、Firefox 或 iOS 上静默失败。
为什么 src 还是没声音——先查 Network 面板里的 Content-Type
浏览器不是“看到 .mp3 就去播”，而是严格按响应头的 Content-Type 决定是否调用音频解码器。本地双击 HTML 文件（file:// 协议）时，Chrome 和 Firefox 会直接返回 text/plain，导致整个 被忽略，连控件都不渲染。
- 必须起本地服务器：比如
python3 -m http.server 8000，让响应头带Content-Type: audio/mpeg - 检查 Network 面板里音频请求的 Response Headers，确认
Content-Type值是audio/mpeg（MP3）、audio/ogg（OGG）、audio/wav（WAV），不能是audio/mp3或空值 - Apache 用户加这行：
AddType audio/mpeg .mp3；Nginx 用户在types块里补：audio/mpeg mp3;
type，且顺序不能错——MP3 放最前，OGG 次之
省略 type 或写错（如 type="audio/mp3"），Safari 和 iOS WebKit 会跳过该源，最终无可用音源。它不报错，只是沉默。
- 正确写法：
audio/mp3 - OGG 必须用 Vorbis 编码（不是 Opus），可用
ffprobe a.ogg确认输出含Audio: vorbis - 顺序很重要：把兼容性最强的放最上，浏览器从上到下匹配第一个支持的
type；推荐mp3 → ogg → wav，别把wav放前面（体积大、加载慢、Chrome 对 IEEE Float 编码直接拒）
play() 报 NotAllowedError 不是代码写错了——是没等用户点一下
Chrome ≥66、Firefox ≥66、Safari ≥11、Edge ≥79 全部强制要求：有声播放必须由真实用户手势（click、touchstart、keydown）触发。在 mounted、DOMContentLoaded 或定时器里调 play()，100% 失败。
把任意文章或文档内容转换成精美的全屏翻页 HTML 演示文件（幻灯片风格）。当用户发来一篇文章、文档链接、Markdown 内容、或粘贴的文本，并且希望生成演示用的 HTML 时触发。支持任意内容来源：iWiki 链接、KM 链接、本地文件路径、直接粘贴的文本。生成的 HTML 文件保存到本地工作区，并通过企微直接发送给用户。触发词示例：帮我把这篇文章做成PPT、转成演示文档、生成HTML幻灯片、做个演示、转成可以演示的格式、article to deck、make a slide。
- 正确姿势：按钮点击后调用，且必须处理 Promise 拒绝：
button.addEventListener('click', () => audio.play().catch(e => console.warn('play blocked:', e))) - iOS Safari 更狠：元素必须在视口内、未被
display: none或opacity: 0遮挡，否则即使点过也静音 - 静音自动播（
autoplay muted）在桌面 Chrome 可行，但微信 iOS WebView 仍常需首次触摸才放行，别硬刚
设置 currentTime 或监听 ended 为什么无效——事件时机比你想的更苛刻
在 loadedmetadata 之前设 currentTime，值会被忽略；在 iOS 上，ended 事件经常不触发，只靠它判断播放完成会漏逻辑。
-
currentTime必须等loadedmetadata事件后才能设，否则读不到duration，跳转也无效 - 判断是否正在播放，别用
audio.paused === false—— 播放结束时paused和ended同时为true，应写成!audio.paused && !audio.ended - iOS 上
ended不可靠，建议用timeupdate节流判断：if (audio.currentTime >= audio.duration - 0.1) { /* 视为结束 */ }
真正卡住人的从来不是语法，而是浏览器对“谁有权启动声音”的持续收紧——它要求你把播放动作和用户意图绑得足够紧，而不是靠属性堆砌蒙混过关。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
