防止 divx 网络插件替换 html5 视频元素?

Posted

技术标签:

【中文标题】防止 divx 网络插件替换 html5 视频元素?【英文标题】:Prevent divx web plugin fron replacing html5 video element? 【发布时间】:2011-06-12 08:25:00 【问题描述】:

出于某种原因,我确信 DivX 的人们认为这很重要,没有直接的方法可以阻止他们的插件用他们喜欢的徽标替换您页面上的所有视频元素。

我需要的是一种解决方法,告诉插件跳过一些视频,即不要用它们的可播放内容替换它们。

【问题讨论】:

我正在尝试在我的网站上使用 html5 作为全屏背景。在启用了 DivX Web 插件的机器上,由于插件完全忽略了 Zindexing,因此视频会覆盖在我的网站之上。我个人觉得这个 BROWSER HIJACK 很恶心。我曾经对 DivX 很有信心,他们肯定用这个插件的可悲借口摧毁了它。 可悲的是,我们对此无能为力。 :-( 【参考方案1】:

我通过放置一个空的 HTML 5 视频标签,然后在 body onload 事件中的 javascript 函数中放入视频源标签来解决这个问题。然后视频会出现在普通的 HTML 5 播放器中,而不是 DivX 网络播放器中。

例如 这会给 DivX 播放器:

<video   controls="controls">
  <source src="movie.mp4" type="video/mp4" />
</video>

但这会给普通的 html 5 播放器:

    <head>
    <script type="text/javascript">
    function changevid() 
       document.getElementById('vid').innerHTML = '<source src="inc/videos/sample1.mp4" type="video/mp4" />';
       document.getElementById('vid').load();
    
    </script>
    </head>
    <body onload="changevid()">

       <video id="vid"   controls="controls">    
       </video>

    </body>

【讨论】:

您可以更进一步,通过 javascript 添加完整的视频标签。我已经亲自测试了很多,并且 DivX 扩展在页面加载后没有捕获/看到任何添加的内容。 mh,我试过这个解决方案,但它对我不起作用。无论如何,如果我使用 jquerys 就绪事件,或者直接加载正文,divx 总是会出现,尤其是在 chrome 中。 我使用了这个解决方案,但是使用了 jQuery。我将视频标签附加到 div,然后将源附加到视频标签。像魅力一样工作 这是旧的,但它也帮助我解决了我的问题。一种规范:您的答案已经使用本机 onload 函数执行此操作,但请确保使用该函数或 $(window).load() 函数。 $(document).ready() 太早了,DivX 插件还在追赶它。不过感谢您的提示! @George,如果我能 +100,我会的。这让我发疯了好几个星期。【参考方案2】:

目前,没有任何 API 或方法可以阻止 divx 插件用占位符替换视频元素。 :-(

【讨论】:

【参考方案3】:

我开始对 divx-plugin 进行逆向工程,以找出如何破解禁用它的方法。一个示例,包括 divx-plugin 的完整源代码,可以在这里找到:http://jsfiddle.net/z4JPB/1/

目前在我看来,可能的解决方案可以像这样工作:

为方法 appendChildreplaceChildinsertBefore 创建一个“干净”备份 - 这必须在执行 chrome 扩展的内容脚本之前发生。 内容脚本将执行,覆盖上述方法并将事件侦听器添加到 DOMNodeInsertedIntoDocumentDOMNodeInserted 事件中 之后,可以移除事件侦听器并恢复原始 DOM 方法。您现在应该可以将插件创建的嵌入元素替换为视频元素

【讨论】:

不幸的是,这并没有像我希望的那样成功。对我有用的唯一解决方案是观察 dom 中是否存在不需要的“嵌入”标签,然后删除它们并呈现用于根本不支持视频的浏览器的后备。但是我确实联系了 divx 的人,他们告诉我他们会将其传递给他们的开发团队——我不相信奇迹,但谁知道......【参考方案4】:

看来,只有当video 标签中有src 元素时,该插件才会替换视频。对我来说,它首先添加 video 标签,然后 - 在第二个线程中 - 添加 src 标签。但是,这在 IE 中不起作用,但 IE 一次插入完整的视频标签没有问题。

所以以下代码在所有浏览器中都适用于我(当然,需要 jQuery):

var $container = $('video_container');
var video = 'my-movie';
var videoSrc = '<source src="video/'+video+'.mp4" type="video/mp4"></source>' +
    '<source src="video/'+video+'.webm" type="video/webm"></source>' +
    '<source src="video/'+video+'.ogv" type="video/ogg"></source>';

if(!$.browser.msie) 
    $container.html('<video autoplay loop></video>');
    // this timeout avoids divx player to be triggered
    setTimeout(function() 
        $container.find('video').html(videoSrc);
    , 50);

else 
    // IE has no problem with divx player, so we add the src in the same thread
    $container.html('<video autoplay loop>' + videoSrc + '</video>');

【讨论】:

以上是关于防止 divx 网络插件替换 html5 视频元素?的主要内容,如果未能解决你的问题,请参考以下文章

HTML5 视频(Video)元素使用详解

psp视频格式中: mpeg4(Divx)与mpeg4(Xvid)的区别!!!

H5 视频

HTML5 Video(视频)

常见的视频格式都有哪些?

HTML5基础知识点笔记