Question

使用例如video.js让视频播放跨平台有点大惊小怪。回到应该嵌入视频的日子里，我使用嵌入式Windows媒体播放器，它在Windows上开箱即用。因为今天只有Windows上的旧版IE不支持视频标签，我尝试使用Windows媒体播放器作为后备，并且它运行良好。

我想知道的是，为什么没有其他人这个解决方案呢？我错过了什么吗？代码非常小，没有闪存文件，跨域问题或需要服务器来实现这一点。它只是有效。

所以在我进一步开发这个并添加自定义控件和字幕支持之前，我想知道你说的是什么。

代码如下所示：

<video id="myVideo" style="width:640px; height: 360px;" autoplay data-wimpsource="http://esd.volvocars.com/dc/cdn/video/birds-on-a-wire.mp4">
    <source src="http://esd.volvocars.com/dc/cdn/video/birds-on-a-wire.mp4" type="video/mp4" />
    <source src="http://esd.volvocars.com/dc/cdn/video/birds-on-a-wire.webm" type="video/webm" />
</video>

function handleVideo(vElementId) {
    var useVideoTag = (typeof(document.createElement('video').canPlayType) != 'undefined'),
        vElement = document.getElementById(vElementId),
        src = vElement.getAttribute('data-wimpsource'),
        playerCode =    '<object id="mediaplayer" classid="clsid:22d6f312-b0f6-11d0-94ab-0080c74c7e95" codebase="http://activex.microsoft.com/activex/controls/mplayer/en/nsmp2inf.cab#version=5,1,52,701" standby="loading media player components..." type="application/x-oleobject" width="100%" height="100%">' + 
                        '<param name="filename" value="' + src + '">' + 
                        '   <param name="animationatstart" value="true">' + 
                        '   <param name="transparentatstart" value="true">' + 
                        '   <param name="autostart" value="true">' + 
                        '   <param name="showcontrols" value="false">' + 
                        '   <param name="ShowStatusBar" value="false">' + 
                        '   <param name="windowlessvideo" value="true">' + 
                        '</object>';

    if (!useVideoTag) {
        var newDiv = document.createElement("div");
        newDiv.style.width = vElement.style.width;
        newDiv.style.height = vElement.style.height;
        vElement.parentNode.replaceChild(newDiv, vElement);
        newDiv.innerHTML = playerCode
    }
}

handleVideo('myVideo');

这是一个有效的演示： http://verodella.se/wimpify.html

这是一个JsFiddle： http://jsfiddle.net/arpo/t5Jtx/

Answer 1

Flash作为在网络上播放视频的行业标准已被使用多年（Youtube确实将每个人都推向了这个方向）。所以我想答案的一部分就在这里。

需要考虑的几件事情：

只有在目标设备上安装了Windows Media Player，才能使用Windows Media Player。我想在带有Internet Explorer的Windows机器上可以，但在Firefox或Chrome或Mac上，用户需要安装一个特定的插件。 Flash在不支持HTML5视频的设备上具有更广泛的采用率（95％+）。
Flash允许进行自适应比特率流，具有良好性能的高清播放，DRM以及构建自定义控件。我不确定它是如何用于WMP组件的（微软使用Silverlight ...他们决定停止支持HTML5视频）。
80% of browsers现在支持HTML5视频。主要的例外是IE8。我想你应该努力构建一个不错的HTML5视频体验（特别是对于移动设备）并提供可能较少选项的后备（因为它被称为优雅降级）。

总而言之，您可以使用WMP作为后备，它将覆盖大多数用户（IE 6,7,8 ......），但选择闪存作为后备是更好的选择。如果您愿意，可以查看Adobe strobe以加快速度。

使用Windows Media Player作为视频标记的视频后备

1 个答案: