加 muted 属性是浏览器放行 autoplay 的必要条件，必须作为布尔属性存在且不能带值，ios 还需配合 playsinline 才能生效。
加 muted 属性不是“让视频静音”的可选操作，而是现代浏览器放行 autoplay 的硬性通行证——没它，autoplay 在绝大多数环境（尤其是 iOS 和 Chrome 移动版）根本不会启动。
video 标签里必须写 muted，不能写 muted="true"
muted 是布尔属性，浏览器只认“存在即生效”。写成 muted="true" 或 muted="false" 会被当字符串处理，直接失效。
- ✅ 正确：
<video autoplay muted></video> - ❌ 错误：
<video autoplay muted="true"></video>（属性带值 → 静音不生效） - ❌ 错误：
<video autoplay muted="false"></video>（浏览器仍视作已静音，但策略逻辑错乱） - Vue/React 中用
:muted="true"渲染也会带值，同样不行；要用muted字面量或v-bind:muted="null"（仅 Vue 3）避免渲染出值
JS 动态设 video.muted = true 无法补救 HTML 缺失的 muted
浏览器在解析 HTML 阶段就检查 muted 是否存在，来决定是否授予 autoplay 权限。JS 后设只是运行时状态切换，不恢复播放资格。
- ❌ 错误顺序：
video.autoplay = true; document.body.appendChild(video); video.muted = true; video.play();（太晚，已错过策略窗口） - ✅ 正确做法（动态创建）：
const v = document.createElement('video'); v.muted = true; v.autoplay = true; v.playsInline = true; v.src = 'a.mp4'; document.body.appendChild(v); v.play().catch(...); - ⚠️ 注意：如果元素已挂载，
v.setAttribute('muted', '')有时能生效，但不如v.muted = true可靠；服务端渲染或静态 HTML 最稳
iOS Safari 必须同时加 playsinline，否则 muted 白搭
iOS Safari 对自动播放极其严格：即使写了 muted 和 autoplay，若没 playsinline，它会强制全屏，且部分机型直接拒绝播放，控制台可能无报错，只黑屏不动。
- ✅ HTML 写法：
<video autoplay muted playsinline webkit-playsinline></video> - ✅ JS 对应：
video.playsInline = true（注意大小写，不是playsinline） - 旧版微信（7.0.5 前）可能还要
x5-video-player-type="h5-page"，但现在基本不用了 - 别忽略 CSS 影响：iOS Safari 对
transform: scale(0.99)、opacity: 0.99等也敏感，可能导致静音策略回退
上线后静音失效？先查响应头和 MIME 类型，不是代码问题
开发时 localhost 跑得好好的，上线后视频黑屏、play() 不触发、控制台也没错误——这类问题几乎 100% 出在 CDN 或反向代理上。
- 检查 Network 面板中视频请求的
Content-Type：必须是video/mp4、video/webm等标准类型，不能是application/octet-stream或text/plain - 确认没被代理层剥离
Access-Control-Allow-Origin（尤其跨域加载 blob URL 时） - 排查是否被注入脚本重写了 HTML，比如把
muted属性给过滤掉了 - 真要彻底规避音频策略？用
ffmpeg -i input.mp4 -an -c:v copy output.mp4去掉音轨，连muted都不用加
最常被忽略的一点：muted 的核心作用从来不是控制音量，而是告诉浏览器“我接受静音”，从而换取自动播放权限——哪怕你紧接着就 video.muted = false，也得先靠它把 play() 跑通。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
