在HTML中嵌入并播放FLV媒体文件

评论(9)

这个说起来比较复杂,并且在以后的html5规范中也将摒弃(个人认为),
但面对目前国内的主流浏览器,如果你想要在网页中播放FLV文件的话,你还是要掌握这个东西。
目前主流浏览器不能直接嵌入并且播放FLV文件,
所以我们需要借助一个html标签object,
来嵌入一个swf媒体播放文件,
并利用该文件来播放你预设的文件。
因为在网上林林总总的有很多介绍文章,
但这些文章不是给的接口参数和swf不符就是没有给出swf下载地址,
所以大家在实验的时候总是不成功。

播放器文件

我找到了一个比较不错的播放器,没有广告并且外观还比较符合当前的审美观。
传送门:flvplayer.swf

播放代码

<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,29,0" width="500" height="400">
  <param name="movie" value="http://yourname.com/flvplayer.swf" />
  <param name="quality" value="high" />
  <param name="allowFullScreen" value="true" />
  <embed src="http://yourname.com/flvplayer.swf" allowfullscreen="true" flashvars="vcastr_file=http://yourname.com/flv/ctdemo.flv&IsAutoPlay=1&LogoUrl=images/logo.jpg" quality="high" pluginspage="http://www.macromedia.com/go/getflashplayer" type="application/x-shockwave-flash" width="960" height="540"></embed>
</object>

参数设置

  • vcastr_file 方法2传递影片flv文件地址参数,多个使用|分开 空
  • vcastr_title 影片标题参数,多个使用|分开,与方法2配合使用 空
  • vcastr_xml 方法3 传递影片flv文件地址参数,样板参考 vcastr.xml
  • IsAutoPlay 影片自动播放参数:0表示不自动播放,1表示自动播放 0
  • IsContinue 影片连续播放参数:0表示不连续播放,1表示连续循环播 1
  • IsRandom 影片随机播放参数:0表示不随机播放,1表示随机播放 0
  • DefaultVolume 默认音量参数 :0-100 的数值,设置影片开始默认音量大小 100
  • BarPosition 控制栏位置参数 :0表示在影片上浮动显示,1表示在影片下方显示 0
  • IsShowBar 控制栏显示参数 :0表示不显示;1表示一直显示;2表示鼠标悬停时显示;3表示开始不显示,鼠标悬停后显示 2
  • BarColor 播放控制栏颜色,颜色都以0x开始16进制数字表示 0x000033
  • BarTransparent 播放控制栏透明度 60
  • GlowColor 按键图标颜色,颜色都以0x开始16进制数字表示 0x66ff00
  • IconColor 鼠标悬停时光晕颜色,颜色都以0x开始16进制数字表示 0xFFFFFF
  • TextColor 播放器文字颜色,颜色都以0x开始16进制数字表示 0xFFFFFF
  • LogoText 可以添加自己网站名称等信息(英文) 空
  • LogoUrl 可以从外部读取logo图片,注意自己调整logo大小,支持图片格式和swf格式 空
  • EndSwf 影片播放结束后,从外部读取swf文件,可以添加相关影片信息,影片分享等信息,需自己制作 空
  • BeginSwf 影片开始播放之前,从外部读取swf文件,可以添加广告,或者网站信息,需自己制作 空
  • IsShowTime 是否显示时间 : 0表示不显示时间,1表示显示时间 1
  • BufferTime 影片缓冲时间,单位(秒) 2

总结

演示就不具体去搞了,其实很简单的玩意,主要是参数和播放器和参数要配套。





  1. @mmmmmm
    做效果的话两种办法,一个是在这里装上插件,
    很显然我不喜欢贴视频,也不会在生产环境装这种插件。
    另一种办法就是截图,怎奈,我懒。

  2. 参数一堆,一个效果都没有。

  3. @和蔼的勇哥
    移动端要看浏览器是否支持吧,
    也有专门针对移动端的播放插件的吧,
    wp不太适合做视频,没有具体研究。

    @林玉
    原因可能有很多种,建议从以下几方面入手:
    1.上传文件夹的权限
    2.看看http服务有没有响应flv这类文件的权限。
    3.其他原因…..
    祝好运~

  4. 楼主你好,请问flvplayer.swf播放器文件和flv视频都上传到服务器上后,在线不能播放是怎么回事呢

  5. @和蔼的勇哥
    你找到解决方案了吗

  6. 在PC端好使,在移动端无法播放。博主有没有在移动端播放的代码

  7. 好文章值得顶!!!!!!!

  8. 谢谢楼主分享!好文章应该顶!!!!

  9. 多谢~~