• 直播播放案例


    <!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=" 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({
            640,
            height: 480,
            file: "/hls/aktv2/aktv2_live.m3u8",
            image: "",
            autostart: true,
            stretching: "uniform",
            repeat: false,
            volume: 100,
            controls: true,
            ak: 'cc94de6803904f2ca7159eedeaced55d'
        });
        -->


    </body>
    </html

  • 相关阅读:
    由于服务主机:DCOM服务进程占用过多CPU,导致系统卡死
    MySQL优化
    input type="file"文件上传到后台读取
    mysql 创建事件
    Quartz.Net实现的定时执行任务调度
    js 编码详解
    C# DateTime.Now 详解
    C# 读写text 详细讲解
    百度地图API详细介绍
    layui table 详细讲解
  • 原文地址:https://www.cnblogs.com/zhouwen2017/p/9015382.html
Copyright © 2020-2023  润新知