Safari视频有声无画的主因是H.264非Baseline Profile编码、moov原子未前置、服务器缺失Accept-Ranges: bytes响应头或video标签缺少controls属性，需依次排查并修复。
你在Safari里点开网页视频，进度条在走、音轨正常播放，但画面始终黑屏或显示空白区域——这不是显卡驱动问题，也不是视频源损坏，而是Safari对H.264编码层级、MP4封装结构或解码路径的兼容性校验失败导致的纯音频通路独活现象。
确认视频编码是否为Baseline Profile
iOS/macOS Safari对H.264编码的Profile级别极其敏感。High Profile或Main Profile编码的MP4，在其他浏览器能播，但在Safari里常触发“有声无画”故障，因为其解码器拒绝加载不兼容的宏块结构。
用ffprobe检查：打开终端，输入 ffprobe -v quiet -show_entries stream=codec_name,profile -of default video.mp4，确认输出中 video.stream.0.profile 显示为 【Baseline】 而非 Main 或 High。
若不是Baseline，必须转码。这一步不可跳过，否则后续所有设置都无效。
强制添加faststart参数重封装MP4
Safari在加载MP4时依赖moov原子（metadata）位于文件开头，否则无法快速定位视频轨道并初始化渲染管线。很多转码工具默认把moov放在末尾，导致Safari只读取到音频轨道就停住。
执行命令：ffmpeg -i input.mp4 -c copy -movflags +faststart output.mp4
注意：-c copy 表示不重新编码，仅移动元数据位置，几秒内完成。这步做完，黑屏问题解决率超70%。
验证服务器是否返回Accept-Ranges: bytes
第一步：在Safari中打开开发者工具（菜单栏「开发」→「显示网页检查器」，如未显示「开发」菜单，请先在偏好设置→高级→勾选「在菜单栏中显示“开发”菜单」）。
第二步：切换到「网络」标签页 → 播放视频 → 找到对应MP4请求 → 点击它 → 查看「标头」→ 向下滚动到「响应标头」区域。
第三步：确认存在 【Accept-Ranges: bytes】 字样。若缺失，Safari会放弃分片加载，只拉取前几KB，结果就是音频能播（header小）、视频轨道根本没载入（需要完整moov+关键帧）。
常见于静态文件托管服务（如GitHub Pages、Netlify默认不加该头），需手动配置。
前端video标签必须带controls属性
方法一：直接修改HTML
将 改为 。
方法二：JavaScript动态注入（适用于动态插入video的页面）
在播放前执行：videoEl.setAttribute('controls', 'true');
没有controls属性时，Safari可能跳过video元素的完整渲染初始化流程，导致video.buffered.length为0、video.videoWidth为0，但audio照样走——这就是“有声无画”的底层表现。
禁用硬件加速临时验证
第一步：Safari → 偏好设置 → 高级 → 勾选「在菜单栏中显示“开发”菜单」。
第二步：顶部菜单栏点击「开发」→「进入响应式设计模式」→ 右上角齿轮图标 → 取消勾选「启用硬件加速」。
第三步：关闭响应式设计模式 → 刷新网页测试视频画面是否出现。
若此时画面恢复，说明当前Mac的GPU驱动或Metal后端与该视频帧格式存在解码冲突，需更新系统或换用软件解码方案。
