---
title: WebRTC API
slug: Web/API/WebRTC_API
translation_of: Web/API/WebRTC_API
---
<div>{{APIRef("WebRTC")}}</div>

<p><span class="seoSummary"><strong>WebRTC</strong>（網路即時通訊技術）是一個提供 Web 應用程式及網站進行錄影或隨選播放串流音訊與影像的技術，可以直接使用瀏覽器進行資料交換而無須透過中介服務。</span>作為一個標準規格，WebRTC 可以提供任何瀏覽器在不需要安裝外掛程式或第三方軟體下，分享應用程式的資料和進行電話會議。</p>

<p>WebRTC 由數個相關而互相協作的API以及網路協定組成。</p>

<p>這裡的技術文件會幫助你了解 :</p>

<p>WebRTC的基本構成，如何設置並同時使用其資料與媒體傳輸連線，以及更多有關資訊。</p>

<h2 id="WebRTC_概念與使用">WebRTC 概念與使用</h2>

<p>WebRTC 有許多服務目的，基本涵括了媒體獲取與串流API，他們為網頁提供了強大的多媒體功能，包括: 音視訊會議，檔案傳輸，身分識別管理，以及提供以傳輸{{Glossary("DTMF")}}訊號來與現存電話系統交互的介面。</p>

<p>建立端點與端點間的連線完全不需要特定驅動程式抑或者第三方插件，在通常情況下也不需要任何中介伺服器</p>

<p>WebRTC serves multiple purposes, and overlaps substantially with the Media Capture and Streams API. Together, they provide powerful multimedia capabilities to the Web, including support for audio and video conferencing, file exchange, identity management, and interfacing with legacy telephone systems by sending {{Glossary("DTMF")}} signals. Connections between peers can be made without requiring any special drivers or plug-ins, and can often be made without any intermediary servers.</p>

<p>Connections between two peers are created using—and represented by—the {{domxref("RTCPeerConnection")}} interface. Once a connection has been established and opened, media streams ({{domxref("MediaStream")}}s) and/or data channels ({{domxref("RTCDataChannel")}}s) can be added to the connection.</p>

<p>Media streams can consist of any number of tracks of media information; tracks, which are represented by objects based on the {{domxref("MediaStreamTrack")}} interface, may contain one of a number of types of media data, including audio, video, and text (such as subtitles or even chapter names). Most streams consist of at least one audio track and likely also a video track, and can be used to send and receive both live media or stored media information (such as a streamed movie).</p>

<p>You can also use the connection between two peers to exchange arbitrary binary data using the {{domxref("RTCDataChannel")}} interface. This can be used for back-channel information, metadata exchange, game status packets, file transfers, or even as a primary channel for data transfer.</p>

<p><em><strong>more details and links to relevant guides and tutorials needed</strong></em></p>

<h2 id="WebRTC_interfaces">WebRTC interfaces</h2>

<p>Because WebRTC provides interfaces that work together to accomplish a variety of tasks, we have divided up the interfaces in the list below by category. Please see the sidebar for an alphabetical list.</p>

<h3 id="Connection_setup_and_management">Connection setup and management</h3>

<p>These interfaces are used to set up, open, and manage WebRTC connections.</p>

<dl>
 <dt>{{domxref("RTCPeerConnection")}}</dt>
 <dd>Represents a WebRTC connection between the local computer and a remote peer. It is used to handle efficient streaming of data between the two peers.</dd>
 <dt>{{domxref("RTCDataChannel")}}</dt>
 <dd>Represents a bi-directional data channel between two peers of a connection.</dd>
 <dt>{{domxref("RTCDataChannelEvent")}}</dt>
 <dd>Represents events that occur while attaching a {{domxref("RTCDataChannel")}} to a {{domxref("RTCPeerConnection")}}. The only event sent with this interface is {{event("datachannel")}}.</dd>
 <dt>{{domxref("RTCSessionDescription")}}</dt>
 <dd>Represents the parameters of a session. Each <code>RTCSessionDescription</code> consists of a description <a href="/en-US/docs/Web/API/RTCSessionDescription/type" title="The property RTCSessionDescription.type is an enum of type RTCSdpType describing the description's type."><code>type</code></a> indicating which part of the offer/answer negotiation process it describes and of the <a href="/en-US/docs/Glossary/SDP" title="SDP: SDP (Session Description Protocol) is the standard describing a peer-to-peer connection. SDP contains the codec, source address, and timing information of audio and video.">SDP</a> descriptor of the session.</dd>
 <dt>{{domxref("RTCStatsReport")}}</dt>
 <dd>Provides information detailing statistics for a connection or for an individual track on the connection; the report can be obtained by calling {{domxref("RTCPeerConnection.getStats()")}}.</dd>
 <dt>{{domxref("RTCIceCandidate")}}</dt>
 <dd>Represents a candidate internet connectivity establishment (ICE) server for establishing an {{domxref("RTCPeerConnection")}}.</dd>
 <dt>{{domxref("RTCIceTransport")}}</dt>
 <dd>Represents information about an internet connectivity establishment (ICE) transport.</dd>
 <dt>{{domxref("RTCPeerConnectionIceEvent")}}</dt>
 <dd>Represents events that occurs in relation to ICE candidates with the target, usually an {{domxref("RTCPeerConnection")}}. Only one event is of this type: {{event("icecandidate")}}.</dd>
 <dt>{{domxref("RTCRtpSender")}}</dt>
 <dd>Manages the encoding and transmission of data for a {{domxref("MediaStreamTrack")}} on an {{domxref("RTCPeerConnection")}}.</dd>
 <dt>{{domxref("RTCRtpReceiver")}}</dt>
 <dd>Manages the reception and decoding of data for a {{domxref("MediaStreamTrack")}} on an {{domxref("RTCPeerConnection")}}.</dd>
 <dt>{{domxref("RTCTrackEvent")}}</dt>
 <dd>Indicates that a new incoming {{domxref("MediaStreamTrack")}} was created and an associated {{domxref("RTCRtpReceiver")}} object was added to the {{domxref("RTCPeerConnection")}} object.</dd>
</dl>

<h3 id="Identity_and_security">Identity and security</h3>

<p>The WebRTC API includes a number of interfaces to manage security and identity.</p>

<dl>
 <dt>{{domxref("RTCIdentityProvider")}}</dt>
 <dd>Enables a user agent is able to request that an identity assertion be generated or validated.</dd>
 <dt>{{domxref("RTCIdentityAssertion")}}</dt>
 <dd>Represents the identity of the a remote peer of the current connection. If no peer has yet been set and verified this interface returns <code>null</code>. Once set it can't be changed.</dd>
 <dt>{{domxref("RTCIdentityProviderRegistrar")}}</dt>
 <dd>Registers an  identity provider (idP).</dd>
 <dt>{{domxref("RTCIdentityEvent")}}</dt>
 <dd>Represents an identity assertion generated by an identity provider (idP). This is usually for an {{domxref("RTCPeerConnection")}}. The only event sent with this type is {{event("identityresult")}}.</dd>
 <dt>{{domxref("RTCIdentityErrorEvent")}}</dt>
 <dd>Represents an error associated with the identity provider (idP). This is usually for an {{domxref("RTCPeerConnection")}}. Two events are sent with this type: {{event("idpassertionerror")}} and {{event("idpvalidationerror")}}.</dd>
 <dt>{{domxref("RTCCertificate")}}</dt>
 <dd>Represents a certificate that an {{domxref("RTCPeerConnection")}} uses to authenticate.</dd>
</dl>

<h3 id="Telephony">Telephony</h3>

<p>These interfaces are related to interactivity with public-switched telephone networks (PTSNs).</p>

<dl>
 <dt>{{domxref("RTCDTMFSender")}}</dt>
 <dd>Manages the encoding and transmission of dual-tone multi-frequency (DTMF) signaling for an {{domxref("RTCPeerConnection")}}.</dd>
 <dt>{{domxref("RTCDTMFToneChangeEvent")}}</dt>
 <dd>Indicates an occurrence of a of dual-tone multi-frequency (DTMF). This event does not bubble (except where otherwise stated) and is not cancelable (except where otherwise stated).</dd>
</dl>

<h2 id="Guides">Guides</h2>

<dl>
 <dt><a href="/en-US/docs/Web/API/WebRTC_API/Protocols">Introduction to WebRTC protocols</a></dt>
 <dd>This article introduces the protocols on top of which the WebRTC API is built.</dd>
 <dt><a href="/en-US/docs/Web/API/WebRTC_API/Connectivity">WebRTC connectivity</a></dt>
 <dd>A guide to how WebRTC connections work and how the various protocols and interfaces can be used together to build powerful communication apps.</dd>
 <dt><a href="/en-US/docs/Web/API/WebRTC_API/Session_lifetime">Lifetime of a WebRTC session</a></dt>
 <dd>WebRTC lets you build peer-to-peer communication of arbitrary data, audio, or video—or any combination thereof—into a browser application. In this article, we'll look at the lifetime of a WebRTC session, from establishing the connection all the way through closing the connection when it's no longer needed.</dd>
 <dt><a href="/en-US/docs/Web/API/WebRTC_API/Signaling_and_video_calling">Signaling and two-way video calling</a></dt>
 <dd>A tutorial and example which turbs a WebSocket-based chat system created for a previous example and adds support for opening video calls among participants. The chat server's WebSocket connection is used for WebRTC signaling.</dd>
 <dt><a href="/en-US/docs/Web/API/WebRTC_API/Using_data_channels">Using WebRTC data channels</a></dt>
 <dd>This guide covers how you can use a peer connection and an associated {{domxref("RTCDataChannel")}} to exchange arbitrary data between two peers.</dd>
 <dt><a href="/en-US/docs/Web/API/WebRTC_API/Using_DTMF">Using DTMF with WebRTC</a></dt>
 <dd>WebRTC's support for interacting with gateways that link to old-school telephone systems includes support for sending DTMF tones using the {{domxref("RTCDTMFSender")}} interface. This guide shows how to do so.</dd>
</dl>

<h2 id="教學">教學</h2>

<dl>
 <dt><a href="/en-US/docs/Web/API/WebRTC_API/adapter.js">Improving compatibility using WebRTC adapter.js</a></dt>
 <dd>The WebRTC organization <a href="https://github.com/webrtc/adapter/">provides on GitHub the WebRTC adapter</a> to work around compatibility issues in different browsers' WebRTC implementations. The adapter is a JavaScript shim which lets your code to be written to the specification so that it will "just work" in all browsers with WebRTC support.</dd>
 <dt><a href="/en-US/docs/Web/API/WebRTC_API/Taking_still_photos">Taking still photos with WebRTC</a></dt>
 <dd>This article shows how to use WebRTC to access the camera on a computer or mobile phone with WebRTC support and take a photo with it.</dd>
 <dt><a href="/en-US/docs/Web/API/WebRTC_API/Simple_RTCDataChannel_sample">一個簡單的 RTCDataChannel 範例</a></dt>
 <dd>{{domxref("RTCDataChannel")}} 介面用於讓兩端點間建立起資料的通道，你可以利用通道來收發資料。這組 API 被設計成與 <a href="/en-US/docs/Web/API/WebSocket_API">WebSocket API</a> 相似，所以可以利用同樣的程式模型套用在這兩套 API 之上。</dd>
</dl>

<h2 id="資源">資源</h2>

<h3 id="Protocols">Protocols</h3>

<h4 id="WebRTC-proper_protocols">WebRTC-proper protocols</h4>

<ul>
 <li><a href="http://datatracker.ietf.org/doc/draft-ietf-rtcweb-alpn/"><cite>Application Layer Protocol Negotiation for Web Real-Time Communications</cite></a></li>
 <li><a href="http://datatracker.ietf.org/doc/draft-ietf-rtcweb-audio/"><cite>WebRTC Audio Codec and Processing Requirements</cite></a></li>
 <li><a href="http://datatracker.ietf.org/doc/draft-ietf-rtcweb-data-channel/"><cite>RTCWeb Data Channels</cite></a></li>
 <li><a href="http://datatracker.ietf.org/doc/draft-ietf-rtcweb-data-protocol/"><cite>RTCWeb Data Channel Protocol</cite></a></li>
 <li><a href="http://datatracker.ietf.org/doc/draft-ietf-rtcweb-rtp-usage/"><cite>Web Real-Time Communication (WebRTC): Media Transport and Use of RTP</cite></a></li>
 <li><a href="http://datatracker.ietf.org/doc/draft-ietf-rtcweb-security-arch/"><cite>WebRTC Security Architecture</cite></a></li>
 <li><a href="http://datatracker.ietf.org/doc/draft-ietf-rtcweb-transports/"><cite>Transports for RTCWEB</cite></a></li>
</ul>

<h4 id="Related_supporting_protocols">Related supporting protocols</h4>

<ul>
 <li><a href="https://tools.ietf.org/html/rfc5245">Interactive Connectivity Establishment (ICE): A Protocol for Network Address Translator (NAT) Traversal for Offer/Answer Protocol</a></li>
 <li><a href="https://tools.ietf.org/html/rfc5389"><cite>Session Traversal Utilities for NAT (STUN)</cite></a></li>
 <li><a href="https://tools.ietf.org/html/rfc7064"><cite>URI Scheme for the Session Traversal Utilities for NAT (STUN) Protocol</cite></a></li>
 <li><a href="https://tools.ietf.org/html/rfc7065"><cite>Traversal Using Relays around NAT (TURN) Uniform Resource Identifiers</cite></a></li>
 <li><a href="https://tools.ietf.org/html/rfc3264"><cite>An Offer/Answer Model with Session Description Protocol (SDP)</cite></a></li>
 <li><a href="https://datatracker.ietf.org/doc/draft-ietf-tram-turn-third-party-authz/"><cite>Session Traversal Utilities for NAT (STUN) Extension for Third Party Authorization</cite></a></li>
</ul>

<h2 id="規範">規範</h2>

<table class="standard-table">
 <thead>
  <tr>
   <th scope="col">Specification</th>
   <th scope="col">Status</th>
   <th scope="col">Comment</th>
  </tr>
 </thead>
 <tbody>
  <tr>
   <td>{{SpecName('WebRTC 1.0')}}</td>
   <td>{{Spec2('WebRTC 1.0')}}</td>
   <td>The initial definition of the API of WebRTC.</td>
  </tr>
  <tr>
   <td>{{SpecName('Media Capture')}}</td>
   <td>{{Spec2('Media Capture')}}</td>
   <td>The initial definition of the object conveying the stream of media content.</td>
  </tr>
  <tr>
   <td>{{SpecName('Media Capture DOM Elements')}}</td>
   <td>{{Spec2('Media Capture DOM Elements')}}</td>
   <td>The initial definition on how to obtain stream of content from DOM Elements</td>
  </tr>
 </tbody>
</table>

<p>In additions to these specifications defining the API needed to use WebRTC, there are several protocols, listed under <a href="#Protocols">resources</a>.</p>

<h2 class="Related_Topics" id="參見">參見</h2>

<ul>
 <li>{{domxref("MediaDevices")}}</li>
 <li>{{domxref("MediaStreamEvent")}}</li>
 <li>{{domxref("MediaStreamConstraints")}}</li>
 <li>{{domxref("MediaStreamTrack")}}</li>
 <li>{{domxref("MessageEvent")}}</li>
 <li>{{domxref("MediaStream")}}</li>
 <li><a href="https://hacks.mozilla.org/2015/06/firefox-multistream-and-renegotiation-for-jitsi-videobridge/">Firefox multistream and renegotiation for Jitsi Videobridge</a></li>
 <li><a href="https://hacks.mozilla.org/2015/04/peering-through-the-webrtc-fog-with-socketpeer/">Peering Through the WebRTC Fog with SocketPeer</a></li>
 <li><a href="https://hacks.mozilla.org/2014/04/inside-the-party-bus-building-a-web-app-with-multiple-live-video-streams-interactive-graphics/">Inside the Party Bus: Building a Web App with Multiple Live Video Streams + Interactive Graphics</a></li>
</ul>