The RTCPeerConnection interface represents a WebRTC connection and handles efficient streaming of data between two peers.

Warning: RTCPeerConnection and RTCSessionDescription are currently prefixed in most browsers. You should include a polyfill if you're using it in any work. For instance:

var PeerConnection = window.RTCPeerConnection || window.mozRTCPeerConnection || window.webkitRTCPeerConnection;
var SessionDescription = window.RTCSessionDescription || window.mozRTCSessionDescription || window.webkitRTCSessionDescription;
var GET_USER_MEDIA = navigator.getUserMedia ? "getUserMedia" :
navigator.mozGetUserMedia ? "mozGetUserMedia" :
navigator.webkitGetUserMedia ? "webkitGetUserMedia" : "getUserMedia";
var v = document.createElement("video");
var SRC_OBJECT = 'srcObject' in v ? "srcObject" :
'mozSrcObject' in v ? "mozSrcObject" :
'webkitSrcObject' in v ? "webkitSrcObject" : "srcObject";
 

Basic Usage

Basic RTCPeerConnection usage involves negotiating a connection between your local machine and a remote one by generating Session Description Protocol to exchange between the two. i.e. The caller sends an offer. The called party responds with an answer. Both parties, the caller and the called party, need to set up their own RTCPeerConnection objects initially:

var pc = new RTCPeerConnection();
pc.onaddstream = function(obj) {
var vid = document.createElement("video");
document.appendChild(vid);
vid.srcObject = obj.stream;
} // Helper functions
function endCall() {
var videos = document.getElementsByTagName("video");
for (var i = 0; i < videos.length; i++) {
videos[i].pause();
} pc.close();
} function error(err) { endCall(); }
 

Initializing the call

If you are the one initiating the initial connection you would call:

// Get a list of friends from a server
// User selects a friend to start a peer connection with
navigator.getUserMedia({video: true}, function(stream) {
pc.onaddstream({stream: stream});
// Adding a local stream won't trigger the onaddstream callback
pc.addStream(stream); pc.createOffer(function(offer) {
pc.setLocalDescription(new RTCSessionDescription(offer), function() {
// send the offer to a server to be forwarded to the friend you're calling.
}, error);
}, error);
}
 

Answering a call

On the opposite end, the friend will receive the offer from the server.

var offer = getOfferFromFriend();
navigator.getUserMedia({video: true}, function(stream) {
pc.onaddstream({stream: stream});
pc.addStream(stream); pc.setRemoteDescription(new RTCSessionDescription(offer), function() {
pc.createAnswer(function(answer) {
pc.setLocalDescription(new RTCSessionDescription(answer), function() {
// send the answer to a server to be forwarded back to the caller (you)
}, error);
}, error);
}, error);
}
 

Handling the answer

Back on the original machine, you'll receive the response, and set it as the remote connection

// pc was set up earlier when we made the original offer
var offer = getResponseFromFriend();
pc.setRemoteDescription(new RTCSessionDescription(offer), function() { }, error);

Properties

This interface inherits properties from its parent element, EventTarget.

RTCPeerConnection.iceConnectionState Read only
Returns an enum of type RTCIceConnectionState that describes the ICE connection state for the connection. When this value changes, a iceconnectionstatechange event is fired on the object. The possible values are:

  • "new": the ICE agent is gathering addresses or waiting for remote candidates (or both).
  • "checking": the ICE agent has remote candidates, on at least one component, and is check them, though it has not found a connection yet. At the same time, it may still be gathering candidates.
  • "connected": the ICE agent has found a usable connection for each component, but is still testing more remote candidates for a better connection. At the same time, it may still be gathering candidates.
  • "completed": the ICE agent has found a usable connection for each component, and is no more testing remote candidates.
  • "failed": the ICE agent has checked all the remote candidates and didn't find a match for at least one component. Connections may have been found for some components.
  • "disconnected": liveness check has failed for at least one component. This may be a transient state, e. g. on a flaky network, that can recover by itself.
  • "closed": the ICE agent has shutdown and is not answering to requests.
RTCPeerConnection.iceGatheringState Read only
Returns an enum of type RTCIceGatheringState that describes the ICE gathering state for the connection. The possible values are:

  • "new": the object was just created, and no networking has occurred yet.
  • "gathering": the ICE engine is in the process of gathering candidates for this connection.
  • "complete": the ICE engine has completed gathering. Events such as adding a new interface or a new TURN server will cause the state to go back to gathering.
RTCPeerConnection.localDescription Read only
Returns a RTCSessionDescription describing the session for the local end of the connection. If it has not yet been set, it can be null.
RTCPeerConnection.peerIdentity Read only
Returns a RTCIdentityAssertion, that is a couple of a domain name (idp) and a name (name) representing the identity of the remote peer of this connection, once set and verified. If no peer has yet been set and verified, this property will return null. Once set, via the appropriate method, it can't be changed.
RTCPeerConnection.remoteDescription Read only
Returns a RTCSessionDescription describing the session for the remote end of the connection. If it has not yet been set, it can be null.
RTCPeerConnection.signalingState Read only
Returns an enum of type RTCSignalingState that describes the signaling state of the local connection. This state describes the SDP offer, that defines the configuration of the connections like the description of the locally associated objects of type MediaStream, the codec/RTP/RTCP options, the candidates gathered by the ICE Agent. When this value changes, a signalingstatechange event is fired on the object. The possible values are:

  • "stable": there is no SDP offer/answer exchange in progress. This is also the initial state of the connection.
  • "have-local-offer": the local end of the connection has locally applied a SDP offer.
  • "have-remote-offer": the remote end of the connection has locally applied a SDP offer.
  • "have-local-pranswer": a remote SDP offer has been applied, and a SDP pranswer applied locally.
  • "have-remote-pranswer": a local SDP offer has been applied, and a SDP pranswer applied remotely.
  • "closed": the connection is closed.

Event handlers

RTCPeerConnection.onaddstream
Is the event handler called when the addstream event is received. Such an event is sent when aMediaStream is added to this connection by the remote peer. The event is sent immediately after the call RTCPeerConnection.setRemoteDescription() and doesn't wait for the result of the SDP negotiation.
该动作是由对端的RTCpeerconnection的addstream动作产生的事件触发。
RTCPeerConnection.ondatachannel
Is the event handler called when the datachannel event is received. Such an event is sent when aRTCDataChannel is added to this connection.
RTCPeerConnection.onicecandidate
Is the event handler called when the icecandidate event is received. Such an event is sent when aRTCICECandidate object is added to the script.
当脚本有新的RTCIceCandidate加入时,就会发送事件,并触发该函数。
RTCPeerConnection.oniceconnectionstatechange
Is the event handler called when the iceconnectionstatechange event is received. Such an event is sent when the value of iceConnectionState changes.
RTCPeerConnection.onidentityresult
Is the event handler called when the identityresult event is received. Such an event is sent when an identity assertion is generated, via getIdentityAssertion(), or during the creation of an offer or an answer.
RTCPeerConnection.onidpassertionerror
Is the event handler called when the idpassertionerror event is received. Such an event is sent when the associated identity provider (IdP) encounters an error while generating an identity assertion.
RTCPeerConnection.onidpvalidationerror
Is the event handler alled when the idpvalidationerror event is received. Such an event is sent when the associated identity provider (IdP) encounters an error while validating an identity assertion.
RTCPeerConnection.onnegotiationneeded
Is the event handler called when the negotiationneeded event, sent by the browser to inform that negotiation will be required at some point in the future, is received.
RTCPeerConnection.onpeeridentity
Is the event handler called when the peeridentity event, sent when a peer identity has been set and verified on this connection, is received.
RTCPeerConnection.onremovestream
Is the event handler called when the removestream event, sent when a MediaStream is removed from this connection, is received.
RTCPeerConnection.onsignalingstatechange
Is the event handler called when the signalingstatechange event, sent when the value ofsignalingState changes, is received.

Methods

RTCPeerConnection()
 
RTCPeerConnection.createOffer()
Creates an offer that is a request to find a remote peer with a specific configuration. The two first parameters of this methods are respectively success and error callbacks, the optional third one are options the user want to have, like audio or video streams.
RTCPeerConnection.createAnswer()
Creates an answer to the offer received by the remote peer, in a two-part offer/answer negotiation of a connection. The two first parameters are respectively success and error callbacks, the optional third one represent options for the answer to be created.
RTCPeerConnection.setLocalDescription()
Changes the local description associated with the connection. The description defines the properties of the connection like its codec. The connection is affected by this change and must be able to support both old and new descriptions. The method takes three parameters, aRTCSessionDescription object to set, and two callbacks, one called if the change of description succeeds, another called if it failed.
RTCPeerConnection.setRemoteDescription()
Changes the remote description associated with the connection. The description defines the properties of the connection like its codec. The connection is affected by this change and must be able to support both old and new descriptions. The method takes three parameters, aRTCSessionDescription object to set, and two callbacks, one called if the change of description succeeds, another called if it failed.
RTCPeerConnection.updateIce()
 
RTCPeerConnection.addIceCandidate()
 
RTCPeerConnection.getConfiguration()
 
RTCPeerConnection.getLocalStreams()
Returns an array of MediaStream associated with the local end of the connection. The array may be empty.
RTCPeerConnection.getRemoteStreams()
Returns an array of MediaStream associated with the remote end of the connection. The array may be empty.
RTCPeerConnection.getStreamById()
Returns the MediaStream with the given id that is associated with local or remote end of the connection. If no stream matches, it returns null.
RTCPeerConnection.addStream()
Adds a MediaStream as a local source of audio or video. If the negotiation already happened, a new one will be needed for the remote peer to be able to use it.
RTCPeerConnection.removeStream()
Removes a MediaStream as a local source of audio or video. If the negotiation already happened, a new one will be needed for the remote peer to stop using it.
RTCPeerConnection.close()
Abruptly closes a connection.
RTCPeerConnection.createDataChannel()
Creates a new RTCDataChannel associated with this connection. The method takes a dictionary as parameter, with the configuration required for the underlying data channel, like its reliability.
RTCPeerConnection.createDTMFSender()
Creates a new RTCDTMFSender, associated to a specific MediaStreamTrack, that will be able to sendDTMF phone signaling over the connection.
RTCPeerConnection.getStats()
Creates a new RTCStatsReport that contains and allows access to statistics regarding the connection.
RTCPeerConnection.setIdentityProvider()
Sets the Identity Provider (IdP) to the triplet given in parameter: its name, the protocol used to communicate with it (optional) and an optional username. The IdP will be used only when an assertion will be needed.
RTCPeerConnection.getIdentityAssertion()
Initiates the gathering of an identity assertion. This has an effect only if the signalingState is not"closed". It is not expected for the application dealing with the RTCPeerConnection: this is automatically done; an explicit call only allows to anticipate the need.

Constructor

new RTCPeerConnection(RTCConfiguration configuration, optional MediaConstraints constraints);
 

Note: While the PeerConnection specification reads like passing an RTCConfiguration object is required, Firefox will supply a default if you don't.

Methods

createOffer

void createOffer(RTCSessionDescriptionCallback successCallback,RTCPeerConnectionErrorCallback failureCallback, optional MediaConstraintsconstraints);

Create offer generates a blob of description data to facilitate a PeerConnection to the local machine. Use this when you've got a remote Peer connection and you want to set up the local one.

Example

var pc = new PeerConnection();
pc.addStream(video);
pc.createOffer(function(desc){
pc.setLocalDescription(desc, function() {
// send the offer to a server that can negotiate with a remote client
});
}
 

Arguments

successCallback
An RTCSessionDescriptionCallback which will be passed a single RTCSessionDescription object
errorCallback
An RTCPeerConnectionErrorCallback which will be passed a single DOMError object
[optional] constraints
An optional MediaConstraints object.

createAnswer

void createAnswer(RTCSessionDescriptionCallback successCallback,RTCPeerConnectionErrorCallback failureCallback, optional MediaConstraintsconstraints)")

Respond to an offer sent from a remote connection.

Example

var pc = new PeerConnection();
pc.setRemoteDescription(new RTCSessionDescription(offer), function() {
pc.createAnswer(function(answer) {
pc.setLocalDescription(answer, function() {
// send the answer to the remote connection
})
})
});
 

Arguments

successCallback
An RTCSessionDescriptionCallback which will be passed a single RTCSessionDescription object
errorCallback
An RTCPeerConnectionErrorCallback which will be passed a single DOMError object
[optional] constraints
An optional MediaConstraints object.

updateIce()

updateIce(optional RTCConfiguration configuration, optional MediaConstraints constraints)

The updateIce method updates the ICE Agent process of gathering local candidates and pinging remote candidates. If there is a mandatory constraint called "IceTransports" it will control how the ICE engine can act. This can be used to limit the use to TURN candidates by a callee to avoid leaking location information prior to the call being accepted. This call may result in a change to the state of the ICE Agent, and may result in a change to media state if it results in connectivity being established.

Example

addIceCandidate()

addIceCandidate (RTCIceCandidate candidate, Function successCallback,RTCPeerConnectionErrorCallback failureCallback);

The addIceCandidate() method provides a remote candidate to the ICE Agent. In addition to being added to the remote description, connectivity checks will be sent to the new candidates as long as the "IceTransports" constraint is not set to "none". This call will result in a change to the connection state of the ICE Agent, and may result in a change to media state if it results in different connectivity being established.

Example

pc.addIceCandidate(new RTCIceCandidate(candidate));
 

createDataChannel

RTCDataChannel createDataChannel (DOMString label, optional RTCDataChannelInitdataChannelDict);

Creates a data channel for sending non video or audio data across the peer connection

Example

var pc = new PeerConnection();
var channel = pc.createDataChannel("Mydata");
channel.onopen = function(event) {
channel.send('sending a message');
}
channel.onmessage = function(event) { console.log(event.data); }

webrtc学习——RTCPeerConnection的更多相关文章

  1. webrtc学习———记录三:mediaStreamTrack

    参考: https://developer.mozilla.org/en-US/docs/Web/API/MediaStreamTrack 转自http://c.tieba.baidu.com/p/3 ...

  2. WebRTC学习笔记_Demo收集

    1.     WebRTC学习 1.1   WebRTC现状 本人最早接触WebRTC是在2011年底,那时Google已经在Android源代码中增加了webrtc源代码,放在/external/w ...

  3. WebRTC学习

    1.     WebRTC学习 1.1   WebRTC现状 本人最早接触WebRTC是在2011年底,那时Google已经在Android源码中加入了webrtc源码,放在/external/web ...

  4. WebRTC学习与DEMO资源一览

    一. WebRTC学习 1.1   WebRTC现状 本人最早接触WebRTC是在2011年底,那时Google已经在Android源码中加入了webrtc源码,放在/external/webrtc/ ...

  5. [转]webrtc学习: 部署stun和turn服务器

    [转]webrtc学习: 部署stun和turn服务器 http://www.cnblogs.com/lingdhox/p/4209659.html webrtc的P2P穿透部分是由libjingle ...

  6. WebRTC学习之九:摄像头的捕捉和显示

    较新的WebRTC源代码中已经没有了与VoiceEngine结构相应的VidoeEngine了,取而代之的是MeidaEngine.MediaEngine包括了MediaEngineInterface ...

  7. WebRTC的RTCPeerConnection()原理探析

    从getUserMedia()到RTCPeerConnection(),自认为难度陡增.我想一方面是之前在Linux平台上学习ROS调用摄像头时,对底层的外设接口调用.摄像头参数都有学习理解:另一方面 ...

  8. WebRTC学习资料大全

    在学习WebRTC,找了些资料,记录一下,供以后查询. 有些需要FQ才能看 WebRTC 介绍 官网在这里:https://webrtc.org/.然后这里有一个官方的Getting Started: ...

  9. WebRTC 学习之 概念总结

    在学习WebRTC的时候,接触到了好多新的概念,在这里做一下备忘吧 RTMP协议 Real Time Messaging Protocol(实时消息传输协议).该协议基于TCP,是一个协议族,包括RT ...

随机推荐

  1. JVM内存模型及内存分配过程

    一.JVM内存模型 JVM主要管理两种类型内存:堆(Heap)和非堆(Permanent区域). 1.Heap是运行时数据区域,所有类实例和数组的内存均从此处分配.Heap区分两大块,一块是 Youn ...

  2. HDU5668 Circle 非互质中国剩余定理

    分析:考虑对给定的出圈序列进行一次模拟,对于出圈的人我们显然可以由位置,编号等关系得到一个同余方程 一圈做下来我们就得到了n个同余方程 对每个方程用扩展欧几里得求解,最后找到最小可行解就是答案. 当然 ...

  3. [转]oracle性能调优之--Oracle 10g AWR 配置

    一.ASH和AWR的故事 1.1 关于ASH 我们都知道,用户在ORACLE数据库中执行操作时,必然要创建相应的连接和会话,其中,所有当前的会话信息都保存在动态性能视图V$SESSION中,通过该视图 ...

  4. SQL Server中CURD语句的锁流程分析

    我只在数据库选项已开启“行版本控制的已提交读”(READ_COMMITTED_SNAPSHOT为ON)中进行了观察. 因此只适用于这种环境的数据库. 该类数据库支持四种不同事务隔离级别,下面分别观察数 ...

  5. Unity3D Mathf函数

    Mathf.Abs绝对值 计算并返回指定参数 f 绝对值. Mathf.Acos反余弦 static function Acos (f : float) : float 以弧度为单位计算并返回参数 f ...

  6. Eclipse 卸载插件

    直奔主题,不罗嗦! 1.help 2.about eclipse 3. 点击Installation Details 4.选中你安装的插件点击Uninstall... 5.从新启动,OK.

  7. Unity给力插件之ShaderForge(三)

    地形模型材质: 使用Unity自带的地形会出现一些问题,所以我尽量使用手工制作的模型来制作地形.而地形又需要只使用一个材质球,于是在此制作一个简单的Shader. 效果图: 注意: 1.颜色遮罩的图片 ...

  8. Extjs 4.x 得到form CheckBox的值

    CheckBox(复选框)主要用来接收用户选择的选项 如图所示(请忽略UI的不好看): 该弹出窗口的主要代码如下: var win = new Ext.Window({ modal : true, t ...

  9. Java 并发之共享对象

    上一篇文章说的是,避免多个线程在同一时间访问对象中的同一数据,这篇文章来详细说说共享和发布对象. 在没有同步的情况下,我们无法预料编译器.处理器安排操作执行的顺序,经常会发生以为“一定会”发生的动作实 ...

  10. MVC 5 第三章 HTML Helper

    提及到HTML helper大家肯定不应该陌生, 因为在书写MVC View的时候肯定需要使用到它.一个HTML Help就是一个返回HTML字符串的方法,这个字符串表示你所期望的类型的内容.例如,你 ...