移动端HTML5视频autoplay不播放主因是浏览器静默拦截未静音视频，须在HTML标签中声明muted属性、移除音频流、添加playsinline/webkit-playsinline，并通过play() Promise捕获NotAllowedError等错误。

移动端 HTML5 视频加了 autoplay 却不播放，大概率不是代码漏写，而是浏览器因“未静音”直接拦截——这个行为没有报错、不弹提示、画面卡在首帧，属于典型的静默失败。排查关键在于确认静音状态是否被浏览器“可信识别”，而非 JS 后期控制。

检查 muted 是否初始声明在 HTML 标签中

浏览器只认加载时就存在的 muted 属性，JS 动态设置无效，尤其在 Safari 17+ 和部分 Android WebView 中会中断播放：

• ✅ 正确写法：
• ❌ 错误写法： + video.muted = true（加载后设置）
• ⚠️ 兼容写法（iOS 10–12）：muted="muted" 可保留，但布尔写法 muted 已足够通用

验证视频是否真静音——不只是属性，还有音轨残留

有些 MP4 文件虽无声音，但封装里仍含空音轨或元数据标记为“有声”，浏览器会检测并拒绝自动播放：

htmlppt.skill

把任意文章或文档内容转换成精美的全屏翻页 HTML 演示文件（幻灯片风格）。当用户发来一篇文章、文档链接、Markdown 内容、或粘贴的文本，并且希望生成演示用的 HTML 时触发。支持任意内容来源：iWiki 链接、KM 链接、本地文件路径、直接粘贴的文本。生成的 HTML 文件保存到本地工作区，并通过企微直接发送给用户。触发词示例：帮我把这篇文章做成PPT、转成演示文档、生成HTML幻灯片、做个演示、转成可以演示的格式、article to deck、make a slide。

下载

• 用 ffprobe video.mp4 检查：若输出含 Stream #0:1(und): Audio，说明存在音频流，哪怕音量为 0
• 用 FFmpeg 彻底移除音轨：ffmpeg -i input.mp4 -vcodec copy -an output.mp4（-an 表示 no audio）
• 避免使用 autoplay="muted" 这类非标准写法，主流浏览器不支持

确认移动端专属属性是否齐全

iOS Safari 强制全屏、Android Chrome 依赖内联策略，缺一不可：

• 必须同时包含：playsinline（标准）和 webkit-playsinline（iOS 兼容）
• 二者必须写在 标签内，CSS 或 JS 添加无效
• 若视频容器初始为 display: none 或 visibility: hidden，即使属性全对也会失败

监听 play() 的 Promise 捕获真实原因

即使写了 autoplay muted，仍可能因网络延迟、资源未就绪等原因失败。主动调用 play() 并捕获错误，能暴露真实拦截点：

• video.play().catch(e => console.warn("自动播放被拒", e.name))
• 常见错误名：NotAllowedError（策略拦截）、NotSupportedError（格式/编解码问题）、AbortError（资源加载中断）
• 不要在 DOMContentLoaded 或 load 事件中直接调用 play()，应等待 canplaythrough 或用户交互后触发

前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！