页内嵌多媒体内容的完美实现

日期:2006-1-13 1:38:50    发布:xiaodaolee

作者 andot 　　如果你不总是用 Windows 上的 Internet Explorer 来上网的话，你可能会注意到，许多网站上的视频点播之类的多媒体内容，你无法直接在 Internet Explorer 以外的其它浏览器中观看，比如明明已经安装了插件却提示缺少插件，或者什么都不提示出现空的框框，或者显示了播放器插件却始终连不上打不开之类的问题，而在 Internet Explorer 上却能够正确的打开并播放。显然这不是由于网络不通或者媒体不存在造成的，而是由于网页内的代码有问题。你可能觉得这无关紧要，因为你已经习惯用 Internet Explorer 来浏览它们了；也可能你曾为此而头疼，如果你是一个 Linux 用户。可是不管怎么样，如果能在所有操作系统平台的所有浏览器上都能正常播放这些多媒体内容，总是一件好的事情。本文就是来解决这些问题的。 本文将介绍如何在网页中內嵌 Windows Media、RealPlayer、Quicktime 和 Flash 的完美方法。这些方法适用于 Windows、Linux、Mac OS X 等操作系统平台上的 Internet Explorer、Mozilla、Firefox、NetScape、Opera 等多种浏览器。 －－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－ 完美内嵌 Windows Media 客户端要求： 对于 Windows 用户，需要安裝 Windows Media Player 7 以上的版本，Windows Media Player 6 不支持 WMV/WMA，推荐安装 Windows Media Player 10。对于非 Internet Explorer 用户，还需要安装Windows Media Player Plug-in for Netscape Navigator。 对于 Mac OS X 用户，需要 Windows Media Player 9 for Mac OS X，对于 Mac OS 8.1-9x，需要安装Windows Media Player 7.1 for for Mac OS 8.1-9x。 对于 Linux 以及 FreeBSD、Solaris 等 Unix 系统用户，需要 VLC media player，并且安装了 VLC for Mozilla/Firefox 的插件。VLC media player 0.80 及其以上的版本支持 WMV/WMA。 实现代码： <object width="420" height="360" classid="CLSID:22D6F312-B0F6-11D0-94AB-0080C74C7E95">      <param name="filename" value=" http://vod.ujn.edu.cn/movies%2Fasf%2F%B ... %B8%E8%2Easf"/>      <embed width="420" height="360" type="application/x-mplayer2" src=" http://vod.ujn.edu.cn/movies%2Fasf%2F%B6%AC%CC%E ... "></embed>  </object> 也可以用下面这段代码： <object width="420" height="360" classid="CLSID:6BF52A52-394A-11d3-B153-00C04F79FAA6">      <param name="url" value=" http://vod.ujn.edu.cn/movies%2Fasf%2F%B ... %B8%E8%2Easf"/>      <embed width="420" height="360" type="application/x-mplayer2" src=" http://vod.ujn.edu.cn/movies%2Fasf%2F%B6%AC%CC%E ... "></embed>  </object> 要点分析： 这两段代码的区别主要是针对 Internet Explorer 的。这两段代码使用了两个不同的 Media Player 对象，第一个是 MediaPlayer.MediaPlayer，第二个是 WMPlayer.OCX。这两个 ActiveX 对象都是针对 Internet Explorer 的，因此它们不影响 Firefox、Opera 等浏览器。这两个对象在 Internet Explorer 上的显示效果是不一样的，第一个对象的显示效果跟在 Windows 上的 Firefox、Opera 内的显示效果是一样的，而第二个对象在 Internet Explorer 上的显示效果是采用 Windows Media Player 本身的皮肤效果，如果你安装了 Windows Media Player 10，采用第二种写法，你在 Internet Explorer 上将会看到 Windows Media Player 10 那种晶莹剔透的皮肤效果。 Firefox 不支持 object 中 classid 属性，只支持 type 属性，而如果发现 object 有 classid 属性以后，它将不理会 object，而只执行 embed。而对于 Opera 则很有趣，它既支持 object，又支持 embed，但是因为 embed 是嵌入到 object 中的，如果它能正确识别 object，它就不再理会 embed，如果它不能识别 object，则执行 embed。因此它不会显示两个播放器。至少我是用的 8.5 版的 Opera 是这样的。而 Internet Explorer 则只识别 object 中的 classid 属性。因此在 object 中，我们不需要指定 type 属性。 对于 embed 标签，我们指定它的 type 为 application/x-mplayer2，在安装了 Windows Media Player 的系统上，它对应于所有 Windows Media Player 能识别的类型，因此你可以任意指定 asf，asx，wmv，wma，avi，mp3 等类型的媒体，而在没有 Windows Media Player，却安装了 VLC media player 的系统上，它对应于所有 VLC media player 能识别的类型，Windows Media Player 支持的媒体类型 VLC media player 均能支持，甚至 VLC media player 支持的媒体类型比 Windows Media Player 更多，因此上面这种写法是完全支持多平台多浏览器的。 对于上面两个不同的 ojbect，指定播放文件的参数是不一样，第一个是用 filename 来指定，第二个是用 url 来指定。而 embed 中指定播放文件的参数是 src，虽然用 filename 也可以，但是 src 更标准一些。 embed 中的文件名必须是完整的