流媒体跳坑: 03-视频会议：使用LiveRTC来做视频直播

一. 简单分析

想象一下，如果你的手机、电视、电脑都可以通过一个平台进行通信，想象一下，你可以在Web应用中轻松地加入视频聊天和p2p数据分享，这就是WebRTC的愿景!

当前主流直播技术做了分析，在低延迟直播技术出现前主要有 WebRTC, HLS 和 RTMP/HTTP-FLV 三个协议：

HLS：延迟主要来自编码解码时产生延迟、网络延迟、CDN 分发延迟。由于它是切片协议，延迟分两大块，一个是服务端有切片缓冲延迟，另一个是在播放端防抖缓冲会有延迟。切片的大小和数量都会 HLS 影响延迟大小，一般在十秒以上。

RTMP/HTTP-FLV: 目前国内大部分厂家在用的 RTMP，它相对于 HLS 在服务端做了优化。RTMP 服务端不再进行切片，而是分别转发每一帧，CDN 分发延迟非常小。RTMP 延迟主要来自播放端防抖缓冲：为提升弱网环境下抖动时直播的流畅度，缓冲延迟一般有五到十秒。

WebRTC： 提供端对端优化,延迟可以达到 1 秒以内,对音视频更友好，可针对音视频做定制化优化!

 

 

 

一. 使用LiveRTC服务器

1. 推本地流（WebRTC方式）

        let test_id = "I-is-test-id"
        async function video_push(){
            // 1.新建peer
            let livePeer = new LivePeerJS(axios,{host_url:"192.168.1.110:8088"})
            // 2.登录Sfu上线
            let ret = await livePeer.login("123456")            
            navigator.mediaDevices.getUserMedia({ video: {width: { ideal: 640 },height: { ideal: 480 },facingMode: "user"}, audio: true }).then(async (stream) => {
              document.getElementById('localVideo').srcObject = stream
              // 3.把流推送到Sfu
              await livePeer.publish_webrtc(test_id,"测试视频",stream )
            })
        }
        video_push();

 

2. 拉取流

        let test_id = "I-is-test-id"
        async function video_subscribe(){
        
            // 1.新建peer
            let livePeer = new LivePeerJS(axios,{host_url:"192.168.1.110:8088"})
            // 2.登录Sfu上线
            let ret = await livePeer.login("123456")
            // 3.定阅流
            livePeer.subscribe_webrtc(test_id, function(stream){
               document.getElementById('remoteVideo').srcObject = stream
            });            
        }
        video_subscribe();

 

二. 自建服务器