网页播放Flash视频尝试的三种方式

news/2024/11/13 4:19:50/

本身不是写HTML代码的，但老板突然让解决播放器适配所有浏览器的问题，过程有点难受。

播放视频最开始是使用H5的video标签播放mp4视频，但是不支持IE 9以下的浏览器，找到的解决方案是html5media，但是在不支持video标签的浏览器上需要等待很长时间才播放视频。可能的原因是html5media在不支持video标签的浏览器上使用Flash的方式来播放mp4格式的视频，但是Flash播放mp4视频不能边下边播，所以得等待视频加载完才能开始播放。

最后想采用Flash的方式播放flv格式的视频。尝试了三种方式，虽然都是浅尝辄止，但是记录下来也能起到抛砖引玉的作用。

方式一：Flowplayer Flash

点击跳转官网

用到的文件包括下面三个

flowplayer-3.2.13.min.js
flowplayer.commercial-3.2.18.swf
flowplayer.controls-3.2.16.swf

html代码如下：

<head><script type="text/javascript" src="flowplayer-3.2.13.min.js"></script>
</head>

<div id="page"><div id="player" style="display:block;width:810px;height:456px""> </div>
<script>flowplayer("player", "flowplayer.commercial-3.2.18.swf",{clip:  {                    //播放属性bufferLength:3,autoPlay: true,autoBuffering: true,url:'http://地址/h264.flv',},plugins: {controls: {                //视频控制栏url: 'flowplayer.controls-3.2.16.swf', fontColor: '#ffffff',timeFontColor: '#333333',play:true,volume:true,mute:false,time:true,stop:false,fullscreen:true,scrubber: true,tooltips: {buttons: true,fullscreen: '全屏',play: '播放',pause: '暂停',fullscreenExit : '退出全屏',  },},
},});
</script>
</div>

视频截图

方式二：FLV Player 官网下载

点击跳转官网

需要的文件

player_flv_maxi.swf

html代码如下：

<object type="application/x-shockwave-flash" data="player_flv_maxi.swf" width="810" height="456" ><param name="movie" value="player_flv_maxi.swf" /><param name="allowFullScreen" value="true" /><param name="quality" value="high"><param name="FlashVars" value="flv=http://地址/h264.flv&autoplay=1&autoload=1" /><embed src="player_flv_maxi.swf" allowfullscreen="true" flashvars="vcastr_file=http://地址/h264.flv&autoplay=1&autoload=1" quality="high" pluginspage="http://www.macromedia.com/go/getflashplayer" type="application/x-shockwave-flash" width="810" height="456"></embed></object>

视频截图：

在这里插入图片描述

方式三：FLV Player

需要的文件：

flvplayer.swf

代码如下：

<body><object class="" id="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=7,0,19,0" width="810" height="456"><param name="movie" value="flvplayer.swf"><param name="quality" value="high"><param name="allowFullScreen" value="true"><param name="loop" value="true"><param name="FlashVars" value="vcastr_file=http://地址/h264.flv&IsAutoPlay=1&IsContinue=1&autoload=1&BufferTime=3"><embed src="flvplayer.swf" allowfullscreen="true" flashvars="vcastr_file=http://地址/h264.flv&IsAutoPlay=1&autoload=1&IsContinue=1" quality="high" pluginspage="http://www.macromedia.com/go/getflashplayer" type="application/x-shockwave-flash" width="810" height="456" loop="true">
</object>

视频截图：

在这里插入图片描述