HTML5微信网页调用监控直播代码接口文档v4.0.171116

更新说明


  1. 支持通过摄像头SN调用单个视频,FLASH及HLS播放按浏览器自适应。
  2. 支持MD5密码传参
  3. 去掉xml获取参数功能,统一改用post方式从远程服务器获取参数,去除type参数
  4. 优化与服务器通讯中断后的自动重连逻辑,同时不影响正在播放的视频
  5. 优化播放效果,当播放异常暂停后的重连逻辑
  6. 播放视频的尺寸根据父容器自动适应

调用示例


//将以下代码嵌入到需要调用视频的HTML页面
<script src="js/jquery.min.js?v=3.1.0" type="text/javascript" charset="utf-8"></script>
<script src="js/jq.getVideo.min.js?v=4.0.171116" type="text/javascript" charset="utf-8"></script>
<!--视频直播容器-->
<div id="yst-video-box" class="video-box"></div>
<script type='text/javascript'>
  +(function($) {
    $('#yst-video-box').getVideo({
      //调用参数:按需增加,可以为空或使用默认值,可以通过URL,JSON传参
      user: 'demo',    //默认用户名
      dev: 'ads-xxxxx' //摄像头序列号或者对应的ID值
    });
  })(jQuery);
</script>

参数说明


参数获取优先级:登录时的参数 > post参数 > url传参 > data属性 > js传参 > js缺省值。所有参数均可省略,省略时将按优先级顺序获取,直至缺省值;

//post获取参数
geturl: '',   //get/post提交的url,为空则从url/data/js获取视频参数
getdata: {},  //get/post提交的参数(json串)

//视频参数
code: 0,      //视频传输协议:0=监控私有协议,1=直播rtmp协议,2=直播hls协议
ip: 'xxx.com', //默认服务器,可以是域名或IP地址
port: '',     //默认端口号,为空则根据传输协议自动采用默认的端口号
user: '',     //默认用户名,rtmp=livestreamname(自定义的实例名)
password: '', //默认密码,rtmp=liveapp(默认live)
dev: '',      //设备ID(值为数字时)/设备sn(值为字符串时),空或0表示获取第1台设备,
src: '',      //视频播放地址,如果有定义则直接调用src而忽略ip,user等参数
autostart: true, //当用户登录后所有设备自动开启切片,优化HLS播放体验,flash方式时忽略此参数

//播放器参数
player: 0,    //播放器:默认自动适应,1=flash播放(PC),2=html5播放(移动端 )
swfPath: 'js/', //播放器路径,player=1时(flash播放时)调用
res: 1,       //分辨率:默认1=辅码流,0=主码流,仅针对flash播放有效
ratio: '0',   //视频高/宽比例:小数0.75或9/16,空或0时不指定比例,占满整个播放容器
auto: 1,      //是否自动播放
//delay: 2000,  //延时播放时间,待生成切片文件/或广告后再播放
//duration: 0,  //连续播放时间限制,达到指定的时间后切断视频源,0表示不限制,暂未限制

//其它参数
control: 0,   //是否显示视频控制按钮
list: 1,      //是否显示播放列表,当前登录账号下有多个可用视频且为HTML5播放时显示
tips: 0,      //是否开启提示
logs: 0       //是否开启日志

url传参


示例1: http://xxx.com?user=demo&dev=48

示例1直接通过浏览器传递监控直播视频的参数(不推荐);

data属性传参


通过播放容器的data-xxx属性传参给js

<div id="video1" class="video-box" data-ip="xxx.com" data-user="demo" data-password=""></div>

js传参


$('#video1').getVideo({
    ip: 'xxx.com',  //默认服务器地址
    user: 'demo',   //默认用户名
    password: '',   //默认密码
    dev: 'sn01',    //设备号/实例名,空或0表示获取第1台设备
});

json返回参数


通过json获取视频参数(传入了geturl的参数),jsonp服务器端实例:

<?php
    $callback = $_REQUEST['callback'];
    $vid = $_REQUEST['vid'];
    //自定义视频参数数组项,可从服务器数据库获取
    $data_array = array(
        array(
        'vid' => '4', 
        'ip' => 'xxx.cn',
        'user' => 'demo1', 
        'password' => '123456',
        ),
        array(
        'vid' => '5', 
        'ip' => 'xxx.com',
        'user' => 'demo2', 
        'password' => '',
        ),
        array(
        'vid' => '6',
        'ip' => 'xxx.com',
        'user' => 'demo3',
        )
    );
    //查询匹配的数组
    foreach ($data_array as $data) {
        if ($vid==$data['vid']){
            $output=$data;
            break;
        }
    }
    //输出JSON
    if ($callback) {
        header('Content-Type: text/javascript');
        echo $callback . '(' . json_encode($output) . ');';
    } else {
        header('Content-Type: application/x-json');
        echo json_encode($output);
        //{"ip":"xxx.com","port":"2005","user":"demo","password":"","dev":""}
    }
?>

    本文档为监控视频的调用接口说明,适用于微信监控直调用、HTML5网页监控直播调用,使用本文档前请确定有使用我司的服务,包括租用平台服务或购买过服务器软件。