用于 wowza vod 的 Jwplayer 质量切换
Jwplayer quality toggle for wowza vod
我正在尝试为 wowza 视频点播 (vod) 网站的 jwplayer 添加质量切换,但它不起作用:
<div id='player_preview' style='float:left;'>
<video id='video_tag' width='750'height='400' controls autoplay>
<source src='video_path/mp4:720_faddi.mp4/playlist.m3u8' type='video/mp4'>
</video>
</div>
<script type='text/javascript'>
if (navigator.userAgent.match(/Android/i) && navigator.userAgent.match(/Firefox/i) )
{ document.getElementById('android_firefox').style.display = '';
document.getElementById('video_tag').style.display = 'none';
}
jwplayer("player_preview").setup({
image: "/uploads/myPoster.jpg",
sources: [{
file: "rtmp://video_path//mp4:720_faddi.mp4",
label: "720p HD"
},{
file: "rtmp://video_path//mp4:480_faddi.mp4",
label: "480p HD"
}],
height: 400,
width: 750,
});
</script>
视频点播还有其他设置吗?
解决了伙计们
错误是没有 video.smil 文件。
我已经创建了它,现在它正在运行。
video.smil 文件应该是这样的:
<smil>
<head>
<meta base="rtmp://server_ip/" />
</head>
<body>
<switch>
<video src="720_faddi.mp4" height="720" system-bitrate="2000000" width="1280" />
<video src="360_faddi.mp4" height="360" system-bitrate="800000" width="640" />
<video src="240_faddi.mp4" height="240" system-bitrate="300000" width="426" />
</switch>
</body>
</smil>
最终代码如下:
<script type='text/javascript' src='/jwplayer.js'></script>
<div id='player_preview' style='float:left;'>
<video id='video_tag' width='560'height='400' controls autoplay>
<source src='http://server_ip/vod/smil:example.smil/playlist.m3u8' type='video/mp4'>
</video>
</div>
<script type='text/javascript'>
if (navigator.userAgent.match(/Android/i) && navigator.userAgent.match(/Firefox/i) )
{ document.getElementById('android_firefox').style.display = '';
document.getElementById('video_tag').style.display = 'none';
}
jwplayer('player_preview').setup({
playlist: [{
sources: [
{file:'http://server_ip/vod//smil:example.smil/jwplayer.smil',},
{file:'http://server_ip/vod//smil:example.smil/jwplayer.smil/playlist.m3u8'}
]
}],
height: 400,
width: 560,
fallback: false,
repeat: true,
autostart: true,
primary: 'flash',
stretching: 'uniform'
});
</script>
我正在尝试为 wowza 视频点播 (vod) 网站的 jwplayer 添加质量切换,但它不起作用:
<div id='player_preview' style='float:left;'>
<video id='video_tag' width='750'height='400' controls autoplay>
<source src='video_path/mp4:720_faddi.mp4/playlist.m3u8' type='video/mp4'>
</video>
</div>
<script type='text/javascript'>
if (navigator.userAgent.match(/Android/i) && navigator.userAgent.match(/Firefox/i) )
{ document.getElementById('android_firefox').style.display = '';
document.getElementById('video_tag').style.display = 'none';
}
jwplayer("player_preview").setup({
image: "/uploads/myPoster.jpg",
sources: [{
file: "rtmp://video_path//mp4:720_faddi.mp4",
label: "720p HD"
},{
file: "rtmp://video_path//mp4:480_faddi.mp4",
label: "480p HD"
}],
height: 400,
width: 750,
});
</script>
视频点播还有其他设置吗?
解决了伙计们
错误是没有 video.smil 文件。 我已经创建了它,现在它正在运行。 video.smil 文件应该是这样的:
<smil>
<head>
<meta base="rtmp://server_ip/" />
</head>
<body>
<switch>
<video src="720_faddi.mp4" height="720" system-bitrate="2000000" width="1280" />
<video src="360_faddi.mp4" height="360" system-bitrate="800000" width="640" />
<video src="240_faddi.mp4" height="240" system-bitrate="300000" width="426" />
</switch>
</body>
</smil>
最终代码如下:
<script type='text/javascript' src='/jwplayer.js'></script>
<div id='player_preview' style='float:left;'>
<video id='video_tag' width='560'height='400' controls autoplay>
<source src='http://server_ip/vod/smil:example.smil/playlist.m3u8' type='video/mp4'>
</video>
</div>
<script type='text/javascript'>
if (navigator.userAgent.match(/Android/i) && navigator.userAgent.match(/Firefox/i) )
{ document.getElementById('android_firefox').style.display = '';
document.getElementById('video_tag').style.display = 'none';
}
jwplayer('player_preview').setup({
playlist: [{
sources: [
{file:'http://server_ip/vod//smil:example.smil/jwplayer.smil',},
{file:'http://server_ip/vod//smil:example.smil/jwplayer.smil/playlist.m3u8'}
]
}],
height: 400,
width: 560,
fallback: false,
repeat: true,
autostart: true,
primary: 'flash',
stretching: 'uniform'
});
</script>