audio标签没反应？先看浏览器是否真支持你的格式
不是所有.mp3、.ogg、.wav都能播——浏览器只认特定编码组合，比如 Safari 能播 .mp3，但对某些用 AAC-LC 以外编码的 MP3 文件会静默失败；Firefox 不支持 .mp3 的旧版解码器，却能稳定播 .ogg；Chrome 对 .wav 支持有限，尤其带 IEEE Float 编码的。
- 用
ffprobe your-audio.mp3查真实编码（别信文件后缀），重点看Stream #0:0: Audio: mp3 (mp3), 44100 Hz, stereo, fltp, 128 kb/s中的fltp（浮点）就容易被 Safari 拒绝 - 最稳的兼容组合是：一个
<audio></audio>标签里塞<source src="a.mp3" type="audio/mpeg"></source>+<source src="a.ogg" type="audio/ogg"></source> - 别省事只写一个
src——没有 fallback，不支持就彻底黑屏，连错误提示都没有
控制台报“MediaError {code: 4}”？那是格式不被支持的明确信号
code: 4 就是 MEDIA_ERR_SRC_NOT_SUPPORTED，不是路径错、不是网络挂，是浏览器打开文件后当场判了死刑。它常被误认为“加载失败”，其实加载成功了，只是解不了码。
- 检查 Network 面板里音频请求的
Content-Type响应头：要是text/plain或空着，服务器根本没配 MIME 类型，浏览器不敢动它 - Apache 用户加一行：
AddType audio/mpeg .mp3；Nginx 用户在types块里补audio/mpeg mp3; - 本地双击 HTML 测试？Chrome 会直接封禁
file://下的音频加载，换 Firefox 或起个python3 -m http.server 8000再试
点了播放按钮还是没声音？大概率是自动播放策略在拦你
现代浏览器（包括微信内置浏览器）默认禁止无用户手势的 play() 调用，哪怕写了 autoplay 和 muted，也得等第一次 click、touchstart 或 keydown 才放行。
- 别在
window.onload里直接audio.play()——99% 失败，Promise 会被 reject，控制台显示 “The play() request was interrupted” - 可靠写法：绑定一次用户交互，比如
document.body.addEventListener('click', () => audio.play().catch(e => {}), { once: true }); - 微信 iOS 端更绝：必须等
WeixinJSBridgeReady事件，否则play()直接静音返回，连 Promise 都不给你
CORS 报错“Blocked by CORS policy”？跨域音频不是加个 header 就完事
音频跨域比图片严格得多——即使服务器返回了 Access-Control-Allow-Origin: *，若音频文件本身没带 crossorigin 属性，浏览器照样当普通资源处理，拒绝解码。
立即学习“前端免费学习笔记（深入）”；
- HTML 侧必须写：
<audio crossorigin="anonymous" src="https://cdn.example.com/song.mp3"></audio> - 服务端除了
Access-Control-Allow-Origin，还得确保Access-Control-Allow-Headers允许Range（音频流式加载依赖它） - CDN 或对象存储（如 OSS、S3）常默认关闭 CORS，得手动配置规则，不能只改源站
最容易被跳过的其实是 MIME 类型和 crossorigin 属性——它们不报红错，只让音频“假装加载成功”，然后彻底沉默。真出问题时，先开 Network 面板盯住响应头，比反复改 JS 有用得多。
