audio.src路径错误或MIME类型缺失是加载失败主因；需通过地址栏直访验证路径、Network面板查状态码与Content-Type，并监控networkState/readyState组合判断真实状态。
音频元素 src 设置错误或服务端 MIME 类型缺失，是加载失败的两大主因；浏览器静默失败不报错，必须主动监听 error 事件并检查 networkState 和响应头才能定位真实问题。
audio.src 路径写错或资源不可达怎么快速验证？
浏览器不会在控制台抛出明显错误，但 audio.networkState 会长期为 0（HTMLMediaElement.NETWORK_EMPTY），且 error 事件几乎从不触发——这本身就是线索。
- 直接把
src的 URL 粘贴到浏览器地址栏打开，看能否下载或播放（排除路径拼写、404、权限问题） - 检查 Network 面板中该请求的 HTTP 状态码：403/404/502 表示服务端问题；CORS 错误会标红并带「blocked by CORS policy」提示
- 确保路径不是本地文件协议（
file://），开发时用http://localhost或https://协议起服务
为什么 audio.error 事件没触发，但就是播不了？
因为很多“失败”根本不算 error 事件范畴：比如用户未交互就调 play() 导致的 NotAllowedError，或 preload="metadata" 时服务器没返回 Accept-Ranges: bytes 头导致元数据加载超时——这些都不会触发 error。
- 真正该盯的信号是：
audio.readyState === 0且audio.networkState === 0，说明媒体元素压根没开始加载 - 若
audio.readyState === 0但networkState > 0，说明已发请求但卡在解码或格式不支持（如服务器返回text/plain而非audio/mpeg） - 务必监听
loadedmetadata和canplaythrough，它们比error更早暴露准备状态
服务端 MIME 类型配置错误怎么查和修？
这是最隐蔽也最高频的加载失败原因。浏览器看到 Content-Type: text/plain 或空着，会直接拒绝解析音频，连 error 都不发。
将 Markdown 文章转换为微信公众号兼容的纯 HTML 格式。当用户要求"转成微信格式"、"生成公众号文章 HTML"、"排版到微信草稿箱"、"微信粘贴格式"时触发。输出带内联样式的纯 HTML，微信编辑器可直接渲染，无需额外适配。支持标题、段落、列表、粗体、行内代码、表格、引用块、代码块、配图的完整转换。
立即学习“前端免费学习笔记（深入）”；
- 用
curl -I https://yoursite.com/sound.mp3查响应头，确认含Content-Type: audio/mpeg（MP3）、audio/ogg（OGG）等正确类型 - Apache 用户在配置中加：
AddType audio/mpeg .mp3；Nginx 在types块里补：audio/mpeg mp3; - 若用 CDN 或对象存储（如 S3），上传时需显式设置
Content-Type元数据，不能依赖文件扩展名自动推断
移动端 iOS Safari 加载失败的特殊表现
iOS Safari 对音频加载更苛刻：即使 src 正确、MIME 正确、有用户手势，首次 play() 仍可能失败——它要求先以 muted=true 播放一次，才解锁后续有声播放能力。
- 初始化时设
<audio muted preload="metadata"></audio>，并在用户点击后先调play().catch()，成功后再audio.muted = false - 不要等
loadeddata就调play()，iOS 上常需等到canplaythrough才稳 - 若音频 URL 含动态参数（如 token），注意 CDN 缓存策略：加
Cache-Control: no-cache会导致预加载失效，建议用哈希文件名 +immutable
真正的加载失败往往藏在服务端响应头和浏览器网络状态里，而不是 JS 报错里；别只盯着 error 事件，networkState 和 readyState 的组合才是诊断起点。
