辽宁快乐12走势图手机版:the5fire的技术博客

彩票开奖查询 www.8a72.cn 关注Python、Django、Vim、Linux、Web开发、团队管理和互联网--Life is short, we need Python.


动手实现m3u8的浏览器播放器

作者:the5fire | 标签:       | 发布:2014-03-29 6:01 a.m. | 阅读量: 47234, 44677

前几天花了点时间研究了下怎么在浏览器中播放m3u8的视频地址,最后终于找到了两个开源的东西可以正常播放,稍稍整理下方便后来人。

m3u8是什么就不介绍了,现在所有视频网站基本都是通过m3u8的方式来播放视频的。

在浏览器上播放m3u8的视频地址有两种方式:

1 html的video标签的方式,这种方式播放很简单:

<!DOCTYPE hmtl>
<html>
<head>
<title>the5fire m3u8 test</title>
</head>
<body>
<video controls autoplay >
    <source src="//stream.gravlab.net/003119/sparse/v1d30/posts/2014/barcelona/barcelona.m3u8">
</video>
</body>
</html>

上面的代码,你直接贴到一个index.html中,用safari浏览器打开就可以直接播了。

但是, 目前只能只有Safari支持,通用性并不好。因此还得采用flash来播放,也就下面的第二种方法。

2 通过开源的swfobject.js以及两个flash组件:OSMF和HLSProvider来播放,上代码:

<!DOCTYPE html>
<html>
<head>
<title>the5fire m3u8 test</title>
<script src="//the5fireblog.b0.upaiyun.com/staticfile/swfobject.js"></script>
</head>
<body>
<div id="player">
</div>
<script>
   var flashvars = {
       // M3U8 url, or any other url which compatible with SMP player (flv, mp4, f4m)
       // escaped it for urls with ampersands
       src: escape("//www.8a72.cn/static/demos/diaosi.m3u8"),
       // url to OSMF HLS Plugin
       plugin_m3u8: "//www.8a72.cn/static/demos/swf/HLSProviderOSMF.swf",
   };
   var params = {
       // self-explained parameters
       allowFullScreen: true,
       allowScriptAccess: "always",
       bgcolor: "#000000"
   };
   var attrs = {
       name: "player"
   };

   swfobject.embedSWF(
       // url to SMP player
       "//www.8a72.cn/static/demos/swf/StrobeMediaPlayback.swf",
       // div id where player will be place
       "player",
       // width, height
       "800", "485",
       // minimum flash player version required
       "10.2",
       // other parameters
       null, flashvars, params, attrs
   );
</script>
</body>
</html>

通过这三个东西的配合就可以播m3u8了,结果很简单,但是对于我这个对flash外行的人来说还是搜索尝试了良久的。这个代码通过浏览器访问文件的方式是不能用的,你得起一个web服务比如:python -m SimpleHTTPServer。然后访问你存的index.html就能工作了。

结果是不是很简单?不过在搜索的时候也找不到有人提供这样的方案,反而找到很多基于OSMF而开发的收费的flash播放器。

上面几个开源项目的地址:

  • //osmf.org
  • //osmf.org/dev/2.0gm/StrobeMediaPlayback.html
  • https://github.com/mangui/HLSprovider
- from www.8a72.cn
----EOF-----

微信公众号:Python程序员杂谈



其他分类:
  • 坐观光巴士 小小代言人带你游广州 2019-04-15
  • 习近平为传统文化“代言” 2019-04-12
  • 这位游客骨骼清奇送你一份小长假游新疆攻略 2019-04-12
  • 5月济南房价走势如何?济南热门楼盘报价一览 ——凤凰网房产济南 2019-04-05
  • 默克尔政权要崩?联盟党闹分裂内政部长威胁“单飞” 2019-04-04
  • 孕妇也要喝奶粉?孕妇奶粉该不该喝要因人而异 2019-03-31
  • 5月份全国首套房贷款利率上涨至5.60% 2019-03-31
  • 新形势下如何做好社区党支部工作 2019-03-27
  • 国际足联成员也就是亚足联成员的中国(大陆)、朝鲜、中华台北、香港、澳门,也可以有蒙古,可联合申办2038年世界杯。其中,中国大陆、朝鲜,算东道主,直接参赛。 2019-03-27
  • 贵州省委常委赵德明任贵阳市委书记(图简历) 2019-03-25
  • 学习贯彻党的十九大精神中央宣讲团宣讲活动综述 2019-03-25
  • 鹿晗全新Remix专辑《Re:Play》发布 首支单曲全球上线鹿晗 专辑 2019-03-21
  • 【奋斗吧2018】风电检修工——荒原上的“听风者” 2019-03-21
  • 世界杯还可以这样看 日媒:中国AI产品抢眼亚洲电子展} 2019-02-27
  • 特朗普下令美国防部组建第六军种“太空军” 2019-02-17
  • 939| 423| 57| 419| 909| 79| 811| 157| 219| 269|