JW Palyer 6如何与Wowza Media Server配合使用?
转载请注明:文章来自www.wowza.cn
注意: 要访问最新的技术资料,请访问http://www.ttstream.com/wowza/
这篇文章介绍了JW palyer 6如何与Wowza Stream Engine 4配合使用

配置


要使用JW Player 6,www.wowza.cn,首先要从longtailvideo.com下载 JW Player 6,然后完成安装。安装过程中会生成一个jwplayer.key 文件,当你用JW Player 6播放Apple HTTP Live Streaming (Apple HLS/Cupertino)时,你会需要它。

当你将JW Palyer 6播放器文件拷贝到你的WEB服务器后,你可以根据下面的例子从Wowza Media Server播放流媒体。这些例子将从你的Web根目录下的jwplayer路径下加载JW Player 6。

RTMP 和 HLS 流媒体
Code:
<html>
<head>
<title>JW Player 6</title>

<script type="text/javascript" src="/jwplayer/jwplayer.js" ></script>
<script>jwplayer.key="[jwplayer-key]"</script>
</head>

<body>

<div id="player">Loading the player...</div>

<script type="text/javascript">
    jwplayer("player").setup({
   	sources: [{
            file: "rtmp://[wowza-address]:1935/vod/mp4:sample.mp4"
        },{
            file: "http://[wowza-address]:1935/vod/sample.mp4/playlist.m3u8"
        }],
        rtmp: {
        bufferlength: 3
    },
    });
</script>
</body>
</html>
RTMP Dynamic Streaming and HLS ABR

注意:下面例子中的播放列表源URLhttp://[wowza-address]:1935/vod/smil:sample.smil/jwplayer.smil将服务端的SMIL文件转变为JW Player支持的客户端动态流播放列表。 要了解更多这个技术的细节,请阅读 如何使用JW Player从Wowza Media Server播放码率自适应流媒体

Code:
<html>
<head>
<title>JW Player 6</title>

<script type="text/javascript" src="/jwplayer/jwplayer.js" ></script>
<script>jwplayer.key="[jwplayer-key]"</script>
</head>

<body>

<div id="player">Loading the player...</div>
 
<script type="text/javascript">

jwplayer("player").setup({
    playlist: [{
        sources: [
            { file: "http://[wowza-address]:1935/vod/smil:sample.smil/jwplayer.smil", },
        ],
    }],
    sources: [{
            file: "http://[wowza-address]:1935/vod/smil:sample.smil/playlist.m3u8"
        }]
});
</script>
</body>
</html>
下面的例子在页面中显示了一个RTMP流的metadata信息(更多细节,请阅读JW Player JavaScript API Reference。)
Code:
<html>
<head>
<title>JW Player 6</title>

<script type="text/javascript" src="/jwplayer/jwplayer.js" ></script>
<script>jwplayer.key="[jwplayer-key]"</script>
</head>

<body>

<div id="player">Loading the player...</div>
<script type="text/javascript" src="/jwplayer/jwplayer.js" ></script>
<script type="text/javascript">
    jwplayer("player").setup({
   	sources: [{
            file: "rtmp://localhost/vod/mp4:sample.mp4"
        },]
    });

    jwplayer("player").onMeta( function(event){
	    for (var key in event) {
		   var obj = event[key];
		   for (var prop in obj) {
		      if (isNaN(prop))
		      {
			      document.getElementById("status").innerHTML += prop + " = " + obj[prop] + "<BR>"

			      if (prop=="trackinfo")
			      {
			      	var trackInfo = obj[prop]
			      	for (var trackProp in trackInfo)
			      	{
			      		var info = trackInfo[trackProp];
			      		for (var p2 in info)
			      		{
			      			document.getElementById("status").innerHTML += "TrackInfo: " + p2 + " = " + p2[info] + "<BR>"
			      		}

			      	}
			      }
			  }

		   }
}
});

</script>
<div id="status"></div>

</body>
</html>