浏览器播放器

页面实现 m3u8的浏览器播放器:

法案一:

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

法案二:

通过开源的swfobject.js以及两个flash组件:OSMF和HLSProvider

<!DOCTYPE html>
<html>
<head>
<title>the5fire m3u8 test</title>
<script src="http://sss.the5fire.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("http://www.the5fire.com/static/demos/diaosi.m3u8"),
       // url to OSMF HLS Plugin
       plugin_m3u8: "http://www.the5fire.com/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
       "http://www.the5fire.com/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>

flask 起一个web 服务

拓展:

开源项目的地址:
    http://osmf.org
    http://osmf.org/dev/2.0gm/StrobeMediaPlayback.html
    https://github.com/mangui/HLSprovider

猜你喜欢

转载自www.cnblogs.com/shaozheng/p/12808714.html
今日推荐