LM视频中间件H5实时视频打开API-创新互联-成都快上网建站

LM视频中间件H5实时视频打开API-创新互联

概览

LM视频中间件支持对接入的海康、大华、GB28181、RTSP、ISUP/EHOME等设备码流进行转换,提供HLS、Websocket-flv, http-flv, webrtc,rtsp流输出。

公司主营业务:网站设计制作、成都网站建设、移动网站开发等业务。帮助企业客户真正实现互联网宣传,提高企业的竞争能力。创新互联建站是一支青春激扬、勤奋敬业、活力青春激扬、勤奋敬业、活力澎湃、和谐高效的团队。公司秉承以“开放、自由、严谨、自律”为核心的企业文化,感谢他们对我们的高要求,感谢他们从不同领域给我们带来的挑战,让我们激情的团队有机会用头脑与智慧不断的给客户带来惊喜。创新互联建站推出江川免费做网站回馈大家。

在这里插入图片描述

视频编码支持:

  • H265
  • H264

音频编码支持:

  • PCMA
  • PCMU
  • G722
  • AAC

实时视频的API调用也比较简单,本文中只针对API调用后需要对URL进行拼接做下说明。

说明:
因目前H5浏览器没有支持H265的显示播放,业界现在H265的播放都是采用修改FLV格式的视频编码,浏览器在收到H265时,采用WASM的方式进行软解码播放,在多路播放时稳定性还待观察,同时对电脑的要求都比较高,并且在移动环境下支持的也不友好,因此我们暂时使用的是服务器转码方案,这样对前端的开发门槛比较低

API接口说明

获取实时流视频地址API中 type 参数根据采用H5播放器自行选择。

视频协议时延利弊
webrtc<500毫秒H5里时延最低,强烈推荐使用
HLS6-15秒时延高,
http-flv<1秒浏览器限制大6个窗口
websocket-flv<1秒时延一般
RTSP<200毫秒时延低,不适合H5播放器

参数 subString 默认为false,获取主码流的播放地址,true为获取辅码流播放地址,辅码流的占用带宽小,但是视频分辨率比主码流低

视频返回的参数 url 在请求不同的视频协议地址时,拼接规则有所不同,具体参见下表:

视频协议拼接后完整的url
webrtcwebrtc://{{ip}}:{{port}}{{url}}
HLShttp(s)😕/{{ip}}:{{port}}{{url}}
http-flvhttp(s)😕/{{ip}}:{{port}}{{url}}
websocket-flvws(s)😕/{{ip}}:{{port}}{{url}}

ip : LM视频中间件访问地址
port : LM视频中间件访问端口
url : 获取实时流视频地址API返回的参数 url

注意

  • 辅码流只支持海康、大华和ISUP(EHOME)协议接入的设备
  • 获取视频地址API返回的参数 ssid 只有是请求码流类型为RTSP时才有效
  • 获取视频地址API返回的参数 expires 数值时指,应用系统在请求视频地址后,却不进行播放,该地址保留的最长时间,若已通过此地址连接观看视频,此参数失效
H5播放示例

相关播放js文件可咨询商务人员获取

HTTP-FLV& Websocket-flv

打开视频

startVideo(data, num) {
    let play1 = document.getElementById(num);
    data.flvPlayer = flvjs.createPlayer({
        type: 'flv',
        isLive: true,
        hasAudio: true,
        hasVideo: true,
        url: data.url
    },
    {
        enableWorker:true,
        stashInitialSize: 64,
        enableStashBuffer: false
    });
    data.flvPlayer.attachMediaElement(play1);
    data.flvPlayer.load();
    data.flvPlayer.on('error', err =>{
        console.log(err);
    });
    data.flvPlayer.play();
    this.selectVideo(num+1);
    data.timerId = setInterval(()=>{
        if(!play1.buffered.length){
            return
        }
    
        var diff = parseFloat(play1.buffered.end(0) - play1.currentTime);   
        if(diff >= 2) {
            play1.playbackRate = 2;
        }
        else if(diff >= 1.5 && diff< 2) {
            play1.playbackRate = 1.3;
        }
        else if (diff< 1.5 && diff >= 1.2){
            play1.playbackRate = 1.2;
        }
        else if (diff< 1.2 && diff >= 0.5){
            play1.playbackRate = 1.1;
        }
        else if(diff< 0.5 && diff >= 0.2){
            play1.playbackRate = 1;
        }
        else if(diff< 0.2){
            play1.playbackRate = 0.5;
        }
    },500);
}

关闭视频

closeVideo_flv(item,index) {
    let play = document.getElementById(index);
    let e = this.outside[index] ? this.outside[index].flvPlayer : null;
    if (!e) {
        return;
    }
    this.selectVideo(index);
    e.pause();
    e.unload();
    e.detachMediaElement();
    e.destroy();
    clearInterval(this.outside[index].timerId);
    this.outside[index].flvPlayer = null;
}
WEBRTC

打开视频

startVideo_webrtc(data, num) {
    let play1 = document.getElementById(num);
    data.flvPlayer = new JSWebrtc_Player(
        data.url, 
        { 
            video: play1, 
            autoplay: true, 
            protocol:window.location.protocol, 
            hostname: window.location.hostname, 
            port:window.location.port
        });
    this.selectVideo(num+1);
}

关闭视频

closeVideo_webrtc(item,index) {
    let play = document.getElementById(index);
    let o = this.outside[index]
    if(o.flvPlayer){
        o.flvPlayer.destroy();

        this.selectVideo(index);
    }
    o.url = null;
    this.outside[index].flvPlayer = null;
}
HLS

打开视频

startVideo_hls(data, num) {
    let video = document.getElementById(num);
    data.html = video.outerHTML;

    var hls = videojs(video);
    hls.src({ type: "application/x-mpegURL", src: data.url });
    hls.load(data.url);
    hls.play();

    data.flvPlayer = hls;
    this.selectVideo(num+1);
}

关闭视频

closeVideo_hls(item, index){
    let e = this.outside[index] ? this.outside[index].flvPlayer : null;
    if (!e) {
        return;
    }
    this.selectVideo(index);
    e.dispose();
    var myVideoDiv = document.getElementById(this.getId(index));
    myVideoDiv.insertAdjacentHTML('afterbegin', this.outside[index].html);
    this.outside[index].flvPlayer = null;
}
常见错误码
resultmessage说明
200OK成功
400invalid cameraId摄像头ID不存在
400Device offLine设备离线
400open failed视频打开请求失败
423invalid server服务错误或授权到期
424user not login用户未登录
426device is sleep设备正在休眠
427device is goto sleep设备正在进入休眠
428Not found user session没找到用户话,重新登陆
523Can’t find key frame没找到视频I帧

你是否还在寻找稳定的海外服务器提供商?创新互联www.cdcxhl.cn海外机房具备T级流量清洗系统配攻击溯源,准确流量调度确保服务器高可用性,企业级服务器适合批量采购,新人活动首月15元起,快前往官网查看详情吧


本文名称:LM视频中间件H5实时视频打开API-创新互联
分享URL:http://kswjz.com/article/diehhd.html
扫二维码与项目经理沟通

我们在微信上24小时期待你的声音

解答本文疑问/技术咨询/运营咨询/技术建议/互联网交流