在GB28181的平台很多，但是能够实现GB28181接入设备的web无插件超低延时的直播确实不多，或者叫没有。有的小公司甚至直接使用开源的工具去实现GB28181转webrtc的直播，前期技术调研时大部分开源代码都看了，除了小部分封包代码值得借鉴，其他发现性能和架构是不具备商用实施基础的。
最终笔者决定采用多线程+协程的方式，对realgbs平台实现了升级，添加了对接入的GB28181设备进行webrtc直播，因为参考开源webrtc规范源码后，全程自主研发。将一些多并发不耗时的碎片化处理过程设计到协程里，减少系统个内核资源切换的开销。同时结合平台直播和操作系统的实际情况，将长期持续高效占用的过程放进了一个独立的线程。这样大大提高了平台的性能。
因为全部自主研发，延时，缓存全部可控，我们最终经过测试实现了常规网络下端到端延时200ms。这样保证在带宽充足的条件下，普通笔记本的cpu和4G的内存可以并发1000路设备实时音视频的转发。如下图：
?
?
如上图，采用多线程+协程处理的webrtc直播后，接入GB28181设备后，其端到端的延时仅有435 - 231 = 204ms，整个平台内存占用10M。这在全国同类产品应该是具有很大的优势了。
webrtc是html5的标准，前端js代码其实也很简单，但是集成到vue里，很多博客都没讲清楚，步骤如下：
1.创建peerconnect，将流对象绑定video元素
this.peerconn = new RTCPeerConnection(null)
this.peerconn.onaddstream = function (event) {
var videoElement = document.getElementById(‘rtc-player‘)
videoElement.srcObject = event.stream
}
2.发送offer
this.peerconn.addTransceiver(‘audio‘, { direction: ‘recvonly‘ })
this.peerconn.addTransceiver(‘video‘, { direction: ‘recvonly‘ })
this.peerconn.createOffer().then((offer) => {
this.peerconn.setLocalDescription(offer)
// 发送offer
let streamurl = `webrtc://${location.hostname}/${this.transmode}/${this.deviceid}`
this.sendrtcoffer(this.flvurl, this.flvurl, streamurl, null, offer.sdp)
3.收到回复，设置远程sdp
sendrtcoffer (url, api, streamurl, clientip, sdp) {
HttpApi.sendoffer(url, api, streamurl, clientip, sdp).then((data) => {
this.peerconn.setRemoteDescription(new RTCSessionDescription({ type: ‘answer‘, sdp: data.sdp })).catch(error => {
console.log(error)
})
})
}
最后我们的高性能realgbs平台下载可以免费使用一年。下载地址：点击下载
多媒体技术交流QQ群: 222955665
wechat(tel): 13971177602
web：www.founu.com
?
基于realgbs的GB28181接入设备的超低延时web无插件直播
原文：https://www.cnblogs.com/founu/p/15232755.html