79 lines
2.6 KiB
HTML
79 lines
2.6 KiB
HTML
|
|
<!DOCTYPE html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
<title>视频监控</title>
|
|
</head>
|
|
<style>
|
|
video::-webkit-media-controls-timeline {
|
|
display: block;
|
|
}
|
|
/* 播放按钮 */
|
|
video::-webkit-media-controls-play-button {
|
|
display: none;
|
|
}
|
|
/* //进度条 */
|
|
video::-webkit-media-controls-timeline {
|
|
display: none;
|
|
}
|
|
/* //观看的当前时间 */
|
|
video::-webkit-media-controls-current-time-display{
|
|
display: none;
|
|
}
|
|
/* //剩余时间 */
|
|
video::-webkit-media-controls-time-remaining-display {
|
|
display: none;
|
|
}
|
|
/* //音量按钮 */
|
|
video::-webkit-media-controls-mute-button {
|
|
display: none;
|
|
}
|
|
video::-webkit-media-controls-toggle-closed-captions-button {
|
|
display: none;
|
|
}
|
|
/* //音量的控制条 */
|
|
video::-webkit-media-controls-volume-slider {
|
|
display: none;
|
|
}
|
|
video::-webkit-media-controls-overflow-button {
|
|
display: none;
|
|
}
|
|
</style>
|
|
<body>
|
|
<script src="flv.min.js"></script>
|
|
<video id="videoElement" style="width: 381px;height: 214px;" muted controls="controls" ></video>
|
|
|
|
<script>
|
|
var ip = window.location.host;
|
|
if (flvjs.isSupported()) {
|
|
console.log(getParam('src'),"getParam('src')");
|
|
var videoElement = document.getElementById('videoElement');
|
|
var flvPlayer = flvjs.createPlayer({
|
|
type: 'flv',
|
|
isLive: true,
|
|
// url: 'ws://172.16.1.168:12309/rtsp/1/a/?url='+getParam('src').replace(/\s+/g, '')
|
|
// url:getParam('src')
|
|
url:'ws://'+ip.split(':')[0]+':12309/rtsp/1/a/?url='+getParam('src').replace(/\s+/g, '')
|
|
});
|
|
flvPlayer.attachMediaElement(videoElement);
|
|
flvPlayer.load();
|
|
flvPlayer.play();
|
|
// 监听 video 标签的事件，防止用户手动暂停
|
|
videoElement.addEventListener('pause', function(e) {
|
|
e.preventDefault();
|
|
videoElement.play(); // 重新播放视频
|
|
});
|
|
}
|
|
|
|
function getParam(name) {
|
|
var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)", "i");
|
|
//search,查询？后面的参数，并匹配正则
|
|
var r = location.search.substr(1).match(reg);
|
|
if (r != null) return decodeURI(decodeURI(r[2]));
|
|
}
|
|
</script>
|
|
</body>
|
|
</html>
|