Live broadcast case

<!DOCTYPE html>
<html>
<head>
    <title>监控测试</title>
    <script src="http://the5fireblog.b0.upaiyun.com/staticfile/swfobject.js"></script>
</head>
<body>
<!--移动端-->
<!-- <video class="vjs-tech" width="100%" height="100%"  
    controls="controls" autoplay="autoplay"  
    x-webkit-airplay="true" x5-video-player-fullscreen="true"  
    preload="auto" playsinline="true" webkit-playsinline  
    x5-video-player-typ="h5">  
    <source type="application/x-mpegURL" src="http://86/live/cameraid/1000006%240/substream/1.m3u8">  
</video> -->
<!--PC-->
   <script src="https://cdn.jsdelivr.net/hls.js/latest/hls.min.js"></script>
   <link href="http://vjs.zencdn.net/c/video-js.css" rel="stylesheet">
   
<video id="video" style=" width: 640px;height:480px;"></video>
<script>

  if(Hls.isSupported()) {
    var video = document.getElementById('video');
    var hls = new Hls();
    hls.loadSource('http:///live/cameraid/1000006%240/substream/1.m3u8');
    hls.attachMedia(video);
    hls.on(Hls.Events.MANIFEST_PARSED,function() {
      video.play();
  });
 }
</script>
<!--PC-->
 <!--
<div id="playercontainer"></div>
<script type="text/javascript" src="http://resource.bcevod.com/player/cyberplayer.js"></script>
<script type="text/javascript">
    var player = cyberplayer("playercontainer").setup({
        width: 640,
        height: 480,
        file: "/hls/aktv2/aktv2_live.m3u8",
        image: "",
        autostart: true,
        stretching: "uniform",
        repeat: false,
        volume: 100,
        controls: true,
        ak: 'cc94de6803904f2ca7159eedeaced55d'
    });
    -->


</body>
</html

Guess you like

Origin http://43.154.161.224:23101/article/api/json?id=326362102&siteId=291194637