WebRTC ,名称源自 网页即时通信 (英语:Web Real-Time Communication)的缩写,是一个支持网页浏览器进行实时语音对话或视频对话的API



作为一名前端需要如何使用呢?


简单实现直播

1、主播端打开摄像头,采集视频。实时通过websocket实时推送

2、观众端,通过websocket接收流,实时更换。


最新api

MediaDevices.getUserMedia
// 捕获摄像头和麦克风。
const mediaStreamConstraints = {
  video: true,
  audio: true
};
 
// 显示流的视频元素。
const localVideo = document.querySelector('video');
 
// MediaStream获取成功的回调函数。
function gotLocalMediaStream(mediaStream) {
  // MediaStream添加到视频元素。
  localVideo.srcObject = mediaStream;
}
 
// MediaStream获取失败的回调函数。
function handleLocalMediaStreamError(error) {
  console.log('navigator.getUserMedia error: ', error);
}
 
navigator.mediaDevices.getUserMedia(mediaStreamConstraints)
  .then(gotLocalMediaStream).catch(handleLocalMediaStreamError);


需要https支持,

本地调试时可以使用虚拟摄像头或者obs进行调试。

0条评论