嵌入的MP4视频无法在Opera、Edge、Chrome等浏览器中播放如何解决

问题排查及解决方法 #

• 编码不兼容：VLC支持几乎所有音视频编码，但Chromium内核浏览器（Chrome/Edge/Opera）仅支持H.264(AVC)视频编码+AAC音频编码封装的MP4文件，若你的视频使用了H.265/HEVC、MPEG-4 Part 2等浏览器不支持的编码，就会出现能下载、能用VLC播放，但浏览器无法加载的情况。可通过转码解决，使用FFmpeg转码的命令参考：ffmpeg -i 输入视频文件名.mp4 -vcodec h264 -acodec aac -crf 23 输出视频文件名.mp4
• 混合内容被拦截：如果你的网页是通过HTTPS协议访问的，而视频资源地址使用的是HTTP协议，主流浏览器会默认拦截这种不安全的混合资源加载，导致视频加载失败。需要将视频资源迁移到支持HTTPS的存储源，或者保证网页和视频使用相同的HTTP协议访问。
• 服务器不支持Range请求：浏览器播放HTML5视频时默认会发送Range请求分段拉取资源，尤其你当前的视频大小有50MB，如果部署视频的服务器不支持Range请求，无法返回206 Partial Content状态码，播放器就会加载卡住。可检查服务器响应头是否包含Accept-Ranges: bytes字段，按照你使用的服务器的官方文档开启Range请求支持即可。
• MIME类型配置错误：如果服务器返回的视频资源响应头中Content-Type字段配置错误，不是video/mp4而是application/octet-stream等通用二进制类型，部分浏览器也会无法识别为可播放的视频资源，需要在服务器配置中为.mp4后缀添加正确的video/mp4 MIME映射。

内容的提问来源于stack exchange，提问作者nmw01223