当 HTML5 在 IE11-Invalid Source 和 Safari-Missing Plugin 中加载视频时出现问题

Posted 2023-03-14

技术标签:

【中文标题】当 HTML5 在 IE11-Invalid Source 和 Safari-Missing Plugin 中加载视频时出现问题【英文标题】：Having issues when HTML5 loads video in IE11-Invalid Source, and in Safari-Missing Plugin 【发布时间】：2014-11-10 17:20:03 【问题描述】：

我们正在学习使用 html5、CSS 和 CSS3。如果你能帮我解决这个问题，请尽可能具体，如果可能的话，请附上几个屏幕截图。

我用嵌入的视频对我的 HTML5 进行了编码，以便它首先显示视频的海报图像（在我嵌入带有标签的视频之前。在我嵌入视频之前和之后，它显示一个无效的来源。这只在 IE 和 Safari 中发生（safari 说缺少插件）。我安装了 IE11、Chrome、Safari 和 Firefox，但在 IE 和 Safari 中只有问题。在 Chrome 和 Firefox 中测试良好。无论出于何种原因，在 Safari 中它说缺少插件。所有这些，在 IE11 的“无效源”之上。非常感谢任何帮助！我已附上代码。

<!DOCTYPE html>
    <html lang="en">
    <head>
    <title>Lighthouse Cruise</title>
    <meta charset="utf-8">
    <h1>Lighthouse Cruise</h1>
    <style>
    video  width: 100%; height: auto; max-width: 320px; 
    </style>
    </head>
    <body>
    <video controls="controls" poster="lighthouse.jpg">
        <source src="lighthouse.mv4" type="video/mp4">
        <source src="lighthouse.ogv" type="video/ogg">
            <embed type="application/x-shockwave-flash" 
            src="lighthouse.swf"
            quality="high"
             
            title="Door County Lighthouse Cruise">
    </video>
    </body>
    </html>

【问题讨论】：

【参考方案1】：

哇，我真的没想到会发布一个问题，然后在 9 小时后回来回答自己，哈哈。所以，这是解决方案：

注意第一个源元素中的 mv4 扩展名。我将其更正为 m4v。加载被阻止的内容后一切正常。还是谢谢。

【讨论】：

【参考方案2】：

我遇到了几乎完全相同的问题。来发现IE是用兼容模式，在模拟IE 7。

将<meta http-equiv="X-UA-Compatible" content="IE=edge"> 放在<head> 之后为我解决了这个问题。

【讨论】：

以上是关于当 HTML5 在 IE11-Invalid Source 和 Safari-Missing Plugin 中加载视频时出现问题的主要内容，如果未能解决你的问题，请参考以下文章

如何在 IE8 浏览器中播放 html5 视频

html5shiv.js让吃屎的IE6IE7IE8支持html5去吧