webRtc

веб-архитектура webRtc

Адрес с открытым исходным кодом на github:fugang1996/videochat: webrtc для видеочата и простой интеграции SDK (github.com)

Структура сети WebRTC

• Структура ячеистой сети: каждый участник отправляет потоки мультимедиа всем другим участникам и принимает потоки мультимедиа, отправленные всеми другими участниками.
• Структура сети MCU: все участники подключены только к центральному медиасерверу mcu, и mcu объединяет видеопотоки всех участников (видеочат Jiugongge)
• Структура сети SFU: медиа-сервер центрального узла отвечает только за пересылку

живое видео

совместное использование экрана

электронная доска

переключить устройство

demo

• Получите медиапоток, соответствующий камере и микрофону

  
  const promsie = navigator.mediaDevices.getUserMedia({{audio:true,video:true}})
  

• Добавлены новые медиатреки

      MediaStream.addTrack()
  

• дорожка мультимедиа удалена

    MediaStream.removeTrack()

• Укажите частоту кадров, разрешение, эхоподавление

    const constraints={ width:{min:640,idea:1280},height:{min:640,ideal:720},aspectRatio:{ideal:1.77777777778} }
    navigator.mediaDevices.getUserMedia({video:true}).then(mediaStream=>{
        const track = mediaStream.getVideoTracks()[0] // 第一个视频轨道
        track.applyConstraints(constranints) // 添加约束
        .then(()=>{}
    )

• немой и черный

let audioTrack = mediaStream.getAudioTracks()[0];
audioTrack.enabled = false; // 静音

let videoTrack = mediaStream.getVideoTracks()[0];
videoTrack.enabled = false; //黑频

• остановить воспроизведение видео

    const tracks = stream.getTracks()
    tracks.forEach(track=>{
        track.stop() // 遍历媒体轨道数组，调用stop() 一一停止
    })

• совместное использование экрана

let constranins // 约束需求
// 举例子
cursor //鼠标光标显示
displaySurface //选择的屏幕内容
logicalSurface //逻辑显示面
const promise = navigator.mediaDevices.getDisplayMedia(constranins)
    

• Запросить все мультимедийные устройства

    const enumeratorPromise= navigator.mediaDevieds.enumerateDevices() //返回所有媒体设备

Слишком много API для использования в будущем. Я упакую его напрямую в SDK и напишу документ SDK. Документ SDK будет отправлен отдельно, а затем будет постоянно обновляться. Сделать виртуальную комнату для совещаний