Videojs front-end can be used to test the live broadcast of video surveillance

Official website: http://videojs.com
GitHub: https://github.com/videojs/video.js
versions Download: https://github.com/videojs/video.js/releases

Original: https://www.52pojie.cn/thread-750154-1-1.html
This is ivi live source address
Central 1, http://ivi.bupt.edu.cn/hls/cctv1.m3u8
Central 2, http://ivi.bupt.edu.cn/hls/cctv2.m3u8
center. 3, http://ivi.bupt.edu.cn/hls/cctv3.m3u8
center. 4, http://ivi.bupt.edu. cn / hls / cctv4.m3u8
center. 5, http://ivi.bupt.edu.cn/hls/cctv5.m3u8
center. 6, http://ivi.bupt.edu.cn/hls/cctv6.m3u8
center 7, http://ivi.bupt.edu.cn/hls/cctv7.m3u8
center. 8, http://ivi.bupt.edu.cn/hls/cctv8.m3u8
center. 9, http://ivi.bupt.edu. cn / hls / cctv9.m3u8
center 10, http://ivi.bupt.edu.cn/hls/cctv10.m3u8
central. 11, http://ivi.bupt.edu.cn/hls/cctv11.m3u8
Central 12 is, http://ivi.bupt.edu.cn/hls/cctv12.m3u8
center 13 is, http://ivi.bupt.edu.cn/hls/cctv13.m3u8
center 14, HTTP: //ivi.bupt .edu.cn / hls / cctv14.m3u8
center 15, http://ivi.bupt.edu.cn/hls/cctv15.m3u8

The two live sources quite smooth:
http://nclive.grtn.cn/ggpd/sd/live.m3u8
http://nclive.grtn.cn/gdws/sd/live.m3u8


<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
    <title></title>
</head>
<body>


    <div margin-top: 10px;>
        <div style="padding-left: 11px;">
            <div style="height: 425px;width: 525px;">
                <video class="video-js vjs-default-skin vjs-fluid vjs-big-play-centered"
                       id="myPlayer"
                       controls playsinline webkit-playsinline autoplay></video>
            </div>
        </div>
    </div>

    <script src="jquery-1.12.0.min.js"></script>
    <link href="video-js.min.css" rel="stylesheet">
    <script src="video.min.js"></script>


    <script type="text/javascript">

        function play(src) {
            var option = {};
            videojs('myPlayer', option, function onPlayerReady() {
                var myPlayer = this;
                myPlayer.src({ src: src, type: "application/x-mpegURL" });
                this.play();
            });
        }

        function initialVideo() {
            var url = 'http://nclive.grtn.cn/ggpd/sd/live.m3u8';
            url = 'http://nclive.grtn.cn/gdws/sd/live.m3u8';
            play(url);
        }

        $(function () {
            initialVideo();
        });

    </script>



</body>
</html>

Guess you like

Origin www.cnblogs.com/guxingy/p/12598535.html