HTML5 video标签内Object标签失效，IE/Edge视频播放异常求排查

看起来你的视频在IE和旧版Edge里没法正常工作，主要是浏览器格式支持、MIME类型错误和HTML语法问题这几个点导致的，咱们一步步来解决：

核心问题分析 #

• 浏览器支持限制：IE9+和旧版Edge（EdgeHTML内核）仅支持H.264编码的MP4视频，完全不兼容Theora编码的OGG文件，所以你第一个<source>标签对这些浏览器来说是无效的。
• MIME类型错误：你在<object>里写的type="video/mpeg"是错误的，MP4视频的正确MIME类型应该是video/mp4，错误的类型会让浏览器无法正确识别视频资源。
• HTML语法不完整：<object>标签没有闭合，这种语法错误会导致浏览器解析DOM时出现异常，影响视频加载。

修复后的代码 #

<video id="my-video" width="320" height="240" controls>
  <!-- 优先加载MP4，适配IE/旧Edge -->
  <source src="video/video.mp4" type="video/mp4">
  <!-- OGG留给支持的浏览器，比如Firefox、Chrome -->
  <source src="video/Videoogg.ogg" type="video/ogg; codecs=&quot;theora, vorbis&quot;">
  <!-- 针对IE8及更早版本的降级方案（如果需要） -->
  <object type="video/mp4" data="video/video.mp4" width="320" height="240">
    <p>你的浏览器不支持视频播放，请下载视频观看：<a href="video/video.mp4">下载MP4</a></p>
  </object>
</video>

关键调整说明 #

• 调整source顺序：把MP4的<source>放在最前面，让IE/旧Edge优先识别并加载它。
• 修正MIME类型：将<object>的type改为video/mp4，同时给OGG的<source>补充了具体的编码信息codecs="theora, vorbis"，帮助浏览器更准确判断支持性。
• 闭合标签并添加降级提示：补全<object>的闭合标签，同时在里面加入文本提示，给完全不支持视频的旧浏览器提供替代方案。
• 添加controls属性：默认显示播放控件，让用户可以操作视频，之前的代码里没加这个，可能会让用户误以为视频没加载。

另外要注意：确保你的MP4视频是H.264视频编码 + AAC音频编码的组合，这是IE和旧Edge唯一支持的MP4编码格式，如果编码不对，即使格式是MP4也没法播放。

内容的提问来源于stack exchange，提问作者K Kiran kumar