HTML5 - Web RTC

万维网联盟(W3C)引入的Web RTC。它支持用于语音呼叫，视频聊天和P2P文件共享的浏览器到浏览器应用程序。

如果要尝试一下?适用于Chrome,Opera和Firefox的Web RTC。一个简单的视频聊天应用程序是一个很好的起点,它位于此处。 Web RTC实现了三个API,如下所示-

• MediaStream             - 可以访问用户的摄像头和麦克风。

• RTCPeerConnection -  访问音频或视频呼叫工具。

• RTCDataChannel       -  获取对等通信。

MediaStream

MediaStream表示同步的媒体流，包含stream.getAudioTracks()和stream.VideoTracks()。 如果没有音轨，它将返回一个空数组，并将检查视频流。如果已连接网络摄像头，stream.getVideoTracks()将返回一个MediaStreamTrack数组，该数组表示来自网络摄像头的流。 一个简单的示例是聊天应用程序，聊天应用程序从网络摄像头，后置摄像头，麦克风中获取信息流。

function gotStream(stream) {
   window.AudioContext=window.AudioContext || window.webkitAudioContext;
   var audioContext=new AudioContext();
   
   //从流中创建一个 AudioNode
   var mediaStreamSource=audioContext.createMediaStreamSource(stream);
   
   //将其连接到目的地以听到自己的声音或任何其他节点进行处理！
   mediaStreamSource.connect(audioContext.destination);
}
navigator.getUserMedia({audio:true}, gotStream);

屏幕截图

在带有mediaStreamSource的Chrome浏览器中,这也是可能的,并且它需要HTTPS。opera尚不提供此函数。可在此处获得示例演示。

会话控制,媒体信息

Web RTC需要浏览器之间的对等通信。该机制需要信令,网络信息,会话控制和媒体信息。 Web开发人员可以选择不同的机制在浏览器之间进行通信,例如SIP或XMPP或任何两种方式的通信。 XHR的示例示例是此处。

var signalingChannel=createSignalingChannel();
var pc;
var configuration=...;

//运行 start(true) 发起呼叫
function start(isCaller) {
   pc=new RTCPeerConnection(configuration);
   
   //send any ice candidates to the other peer
   pc.onicecandidate=function (evt) {
      signalingChannel.send(JSON.stringify({ "candidate": evt.candidate }));
   };
   
   //once remote stream arrives, show it in the remote video element
   pc.onaddstream=function (evt) {
      remoteView.src=URL.createObjectURL(evt.stream);
   };
   
   //get the local stream, show it in the local video element and send it
   navigator.getUserMedia({ "audio": true, "video": true }, function (stream) {
      selfView.src=URL.createObjectURL(stream);
      pc.addStream(stream);
      
      if (isCaller)
         pc.createOffer(gotDescription);
      
      else
         pc.createAnswer(pc.remoteDescription, gotDescription);
         
         function gotDescription(desc) {
            pc.setLocalDescription(desc);
            signalingChannel.send(JSON.stringify({ "sdp": desc }));
         }
      });
   }
   
   signalingChannel.onmessage=function (evt) {
      if (!pc)
         start(false);
         var signal=JSON.parse(evt.data);
      
      if (signal.sdp)
         pc.setRemoteRemark(new RTCSessionDescription(signal.sdp));
      
      else
         pc.addIceCandidate(new RTCIceCandidate(signal.candidate));
};