如果你不总是用 Windows 上 Internet Explorer 来上网话你可能会注意到许多网站WebSite上视频点播的类多媒体内容你无法直接在 Internet Explorer 以外其它浏览器中观看比如明明已经安装了插件却提示缺少插件或者什么都不提示出现空框框或者显示了播放器插件却始终连不上打不开的类问题而在 Internet Explorer 上却能够正确打开并播放显然这不是由于网络不通或者媒体不存在造成而是由于网页内代码有问题你可能觉得这无关紧要你已经习惯用 Internet Explorer 来浏览它们了；也可能你曾为此而头疼如果你是个 Linux 用户可是不管如何样如果能在所有操作系统平台所有浏览器上都能正常播放这些多媒体内容总是件好事情本文就是来解决这些问题

本文将介绍如何在网页中內嵌 Windows Media、RealPlayer、Quicktime 和 Flash 完美思路方法这些思路方法适用于 Windows、Linux、Mac OS X 等操作系统平台上 Internet Explorer、Mozilla、Firefox、NetScape、Opera 等多种浏览器 客户端要求:

对于 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\" id=\"CLSID:22D6F312-B0F6-11D0-94AB-0080C74C7E95\"><param name=\"filename\" value=\"http://vod.ujn.edu.cn/movies%2Fasf%2F%B6%AC%CC%EC%C1%B5%B8%E8%2Easf\" /><embed width=\"420\" height=\"360\" type=\"application/x-mplayer2\" src=\"http://vod.ujn.edu.cn/movies%2Fasf%2F%B6%AC%CC%EC%C1%B5%B8%E8%2Easf\"></embed></object>




也可以用下面这段代码:



代码:
<object width=\"420\" height=\"360\" id=\"CLSID:6BF52A52-394A-11d3-B153-00C04F79FAA6\"><param name=\"url\" value=\"http://vod.ujn.edu.cn/movies%2Fasf%2F%B6%AC%CC%EC%C1%B5%B8%E8%2Easf\" /><embed width=\"420\" height=\"360\" type=\"application/x-mplayer2\" src=\"http://vod.ujn.edu.cn/movies%2Fasf%2F%B6%AC%CC%EC%C1%B5%B8%E8%2Easf\"></embed></object>




要点分析:

这两段代码区别主要是针对 Internet Explorer 这两段代码使用了两个区别 Media Player 对象第个是 MediaPlayer.MediaPlayer第 2个是 WMPlayer.OCX这两个 ActiveX 对象都是针对 Internet Explorer 因此它们不影响 Firefox、Opera 等浏览器这两个对象在 Internet Explorer 上显示效果是不样第个对象显示效果跟在 Windows 上 Firefox、Opera 内显示效果是样而第 2个对象在 Internet Explorer 上显示效果是采用 Windows Media Player 本身皮肤效果如果你安装了 Windows Media Player 10采用第 2种写法你在 Internet Explorer 上将会看到 Windows Media Player 10 那种晶莹剔透皮肤效果

Firefox 不支持 object 中 id 属性只支持 type 属性而如果发现 object 有 id 属性以后它将不理会 object而只执行 embed而对于 Opera 则很有趣它既支持 object又支持 embed但是 embed 是嵌入到 object 中如果它能正确识别 object它就不再理会 embed如果它不能识别 object则执行 embed因此它不会显示两个播放器至少我是用 8.5 版 Opera 是这样而 Internet Explorer 则只识别 object 中 id 属性因此在 object 中我们不需要指定 type 属性

对于 embed 标签我们指定它 type 为 application/x-mplayer2在安装了 Windows Media Player 系统上它对应于所有 Windows Media Player 能识别类型因此你可以任意指定 asfasxwmvwmaavimp3 等类型媒体而在没有 Windows Media Player却安装了 VLC media player 系统上它对应于所有 VLC media player 能识别类型Windows Media Player 支持媒体类型 VLC media player 均能支持甚至 VLC media player 支持媒体类型比 Windows Media Player 更多因此上面这种写法是完全支持多平台多浏览器

对于上面两个区别 ojbect指定播放文件参数是不样第个是用 filename 来指定第 2个是用 url 来指定而 embed 中指定播放文件参数是 src虽然用 filename 也可以但是 src 更标准些

embed 中文件名必须是完整 url 路径否则 VLC media player 不能正确识别另外要对文件路径进行 url 编码否则如果文件路径中如果有中文或者其他非英文文字话在非 Internet Explorer 浏览器中也无法正确识别不要对 “协议://域名/” 部分进行 url 编码否则所有浏览器都不能识别呵呵



对文件路径进行 url 编码在 php 中可以使用 rawurlencode 在 asp 中可以使用 Server.URLencode

完美内嵌 RealPlayer (RealMedia)

客户端要求:

对于 WindowsLinux 和 Mac OS X可以安装 Realplayer 播放器及其浏览器插件也可以安装带有 RealPlayer 解码器及其浏览器插件其他播放器例如 Windows 上可以安装暴风影音

实现代码:

代码:
<object id=\"clsid:CFCDAA03-8BE4-11cf-B84B-0020AFBBCCFA\" width=\"420\" height=\"310\"><param name=\"src\" value=\"link.php?link=rtsp%3A%2F%2Fvod%2Eujn%2Eedu%2Ecn%2F%D0%C2%D4%FA%CA%A6%C3%C3%2F1%2Erm\" /><param name=\"controls\" value=\"Imagewindow\" /><param name=\"console\" value=\"clip1\" /><param name=\"autostart\" value=\"true\" /><embed src=\"link.php?link=rtsp%3A%2F%2Fvod%2Eujn%2Eedu%2Ecn%2F%D0%C2%D4%FA%CA%A6%C3%C3%2F1%2Erm\" type=\"audio/x-pn-realaudio-plugin\" autostart=\"true\" console=\"clip1\" controls=\"Imagewindow\" width=\"420\" height=\"310\"></embed></object><br /><object id=\"clsid:CFCDAA03-8BE4-11cf-B84B-0020AFBBCCFA\" width=\"420\" height=\"44\"><param name=\"src\" value=\"link.php?link=rtsp%3A%2F%2Fvod%2Eujn%2Eedu%2Ecn%2F%D0%C2%D4%FA%CA%A6%C3%C3%2F1%2Erm\" /><param name=\"controls\" value=\"ControlPanel\" /><param name=\"console\" value=\"clip1\" /><param name=\"autostart\" value=\"true\" /><embed src=\"link.php?link=rtsp%3A%2F%2Fvod%2Eujn%2Eedu%2Ecn%2F%D0%C2%D4%FA%CA%A6%C3%C3%2F1%2Erm\" type=\"audio/x-pn-realaudio-plugin\" autostart=\"true\" console=\"clip1\" controls=\"ControlPanel\" width=\"420\" height=\"44\"></embed></object>




link.php

代码:
<?phpecho (get_magic_quotes_gpc ? stripslashes($_GET[\'link\']) : $_GET[\'link\']);?>




要点分析:

上面代码实现了效果是在任何安装了 realplayer 插件浏览器上都可以看到个播放窗口和个播放控制栏并且媒体被自动加载播放对于 object 段这里就不做详细解释了它是针对 Internet Explorer 相信大部分写过这种代码人都能看得懂我们重点来说下 embed 段它是针对 Firefox 和 Opera 等浏览器

大部分人在使用 Firefox 和 Opera 时经常会遇到个问题就是安装了 RealPlayer 及其浏览器插件以后仍然不能观看嵌入到网页中 rm 或 rmvb 流媒体提示找不到插件或者显示空白或者显示了内嵌播放器却不能播放这是什么原因造成呢？

如果你在 Firefox 和 Opera 地址栏中键入:about:plugins 可以看到你所安装所有插件不管你系统里是否安装是真 RealPlayer 播放器只要你看到下面内容
Windows

RealPlayer(tm) G2 LiveConnect-Enabled Plug-In (32-bit)

文件名: nppl3260.dll
RealPlayer(tm) LiveConnect-Enabled Plug-In

MIME 类型 描述 后缀 已启用
audio/x-pn-realaudio-plugin RealPlayer(tm) as Plug-in rpm 是

Linux

Helix DNA Plugin: RealPlayer G2 Plug-In Compatible

文件名: nphelix.so
Helix DNA Plugin: RealPlayer G2 Plug-In Compatible version 0.4.0.552 built
with gcc 3.2.0 _disibledevent=>



首先我们必须要先知道件事情那就是 rpm 是种什么文件从上面 Linux 上插件信息中我们可以得知它是 RealPlayer 插件元文件(RealPlayer Plugin Metafile)因此它不是媒体内容文件更不是红帽安装包文件它里面内容是实际媒体位置信息(url)这样我们就很容易理解 RealNetworks 为什么要这样做了这样只要指定种 type就能够播放所有 Real 媒体了这不是很方便吗？

在这里需要注意点是embed src 属性里指定路径不需要是完整 url相对路径就可以了而且也不定是 rpm 后缀文件因此上面代码中src 中指定是个 link.php而这个结果就是个 rpm 格式文件因此它能够被正确播放这个 link 很简单它只是把传入参数 link 以文件内容形式返回就行了

虽然 embed src 属性不需要完整 url但是 link.php 参数 link 是需要实际媒体完整 url 并且参数 link 要以 url 编码形式进行编码否则 RealPlayer 插件不能够识别带有非英文路径但是返回 rpm 文件内容中 url 无需编码了RealPlayer 能够识别 rpm 文件内容中非英文编码路径如果你实在不放心也可以对它进行 url 编码但是仍然不要对 “协议://域名/” 部分进行 url 编码否则 RealPlayer 插件就不能识别了

PHP 中 $_GET 中变量如果 php 配置文件中 magic_quotes_gpc 设为 true 话(默认配置)它会对某些特殊加上反斜杠这样做是为了避免数据库注入漏洞但这里我们不写数据库因此这里我们需要根据 magic_quotes_gpc 状态来判断是否去掉多出来反斜杠否则输出文件内容可能是

如果用 ASP则不需这么麻烦只需要行代码就搞定了:

代码:
<%=Request(\"link\")%>






完美内嵌 Quicktime

客户端要求:

对于 Windows 用户和 Mac OS X 用户安装相应版本 QuickTime 播放器即可Windows 版下载 QuickTimeer.exeMac OS X 版下载 QuickTimeer.exe

Windows 用户也可以安装暴风影音等带有 QuickTime 解码器和浏览器插件其他播放器例如暴风影音

对于 Linux 以及 FreeBSD、Solaris 等 Unix 系统用户需要 VLC media player并且安装 VLC for Mozilla/Firefox 插件

实现代码:



代码:
<object id=\"clsid:02BF25D5-8C17-4B23-BC80-D3488ABDDC6B\" codebase=\"http://www.apple.com/qtactivex/qtplugin.cab\" width=\"420\" height=\"360\"><param name=\"autoplay\" value=\"true\" /><param name=\"src\" value=\"mov%2F%B2%E2%CA%D4%2Emov\" /><embed src=\"mov%2F%B2%E2%CA%D4%2Emov\" type=\"video/quicktime\" autoplay=\"true\" width=\"420\" height=\"360\"></embed></object>




要点分析:

QuickTime 格式内嵌比较简单像上面那样写就可以了基本上没有什么要注意地方媒体路径 src 值可以是完整地址也可以是相对地址可以用 url 编码也可以不编码QuickTime 插件和 VLC 插件都能正确支持当然为了保险起见最好还是采用 url 编码方式里写媒体路径

虽然 embed 中指定是 video/quicktime 类型但是即使链接媒体是 mp3 仍然能播放对于 QuickTime 支持其他类型没有进行测试但我想应该也是可以

完美内嵌 Flash

客户端要求:

安装你所使用浏览器 Flash 插件

实现代码:



代码:
<object id=\"clsid:D27CDB6E-AE6D-11cf-96B8-444553540000\" width=\"420\" height=\"320\"><param name=\"movie\" value=\"flash/打电话记.swf\" /><param name=\"quality\" value=\"high\" /><embed src=\"http://127.0.0.1/Files/BeyondPic/2007-4/19/0741912410240922.swf\" quality=\"high\" type=\"application/x-shockwave-flash\" width=\"420\" height=\"320\"></embed></object>




要点分析:

对于 Flash 似乎没什么好说这个用很普遍在这里写下来只是为了查阅方便算是凑数吧呵呵