WebRTCのサンプル一覧

以下の記事を参考に書いてます。

・WebRTC samples

1. WebRTC

「WebRTC」を使用すると、オープンスタンダード上で動作するリアルタイム通信機能をアプリケーションに追加できます。ピア間で送信されるビデオ、音声、および一般的なデータをサポートしているため、開発者は強力な音声およびビデオ通信ソリューションを構築できます。

このテクノロジーは、すべての主要なプラットフォームのネイティブクライアントだけでなく、最新のすべてのブラウザで使用できます。「WebRTC」の背後にあるテクノロジーは、オープンWeb標準として実装されており、すべての主要なブラウザで通常の「JavaScript API」として使用できます。

AndroidやiOSなどのネイティブクライアントの場合、同じ機能を提供するライブラリを利用できます。

「WebRTC」プロジェクトはオープンソースであり、Apple、Google、Microsoft、Mozillaなどによってサポートされています。

2. WebRTCのサンプル

「WebRTC」には、カメラやマイクを使用する基本的なWebアプリから、より高度なビデオ通話アプリケーションや画面共有まで、さまざまなユースケースがあります。テクノロジーがどのように機能し、何に使用できるかをよりよく示すために、多数のコードサンプルを収集しました。すべてのサンプルのコードは、GitHubリポジトリで入手できます。

ほとんどのサンプルでは、仕様変更やプレフィックスの違いからアプリを隔離するためのシムである「adapter.js」を使用しています。

【警告】これらのサンプルをテストする場合は、ヘッドフォンを使用することを強くお勧めします。そうしないと、システムで大きなオーディオフィードバックが発生するおそれがあります。

◎ getUserMedia()
メディアデバイスへのアクセス。

・基本的なgetUserMediaのデモ
・CanvasでのgetUserMediaの利用
・CanvasとCSSフィルタでのgetUserMediaの利用
・カメラ解像度の選択
・音声のみのgetUserMedia()のローカルオーディオ要素への出力
・音声のみのgetUserMedia()の音量表示
・ストリームの記録
・getDisplayMediaによる画面共有

◎ Devices
メディアデバイスのクエリ。

・カメラ、マイク、スピーカーの選択
・メディアソースとオーディオ出力の選択

◎ Stream capture
CanvasまたはVideoからストリーミング。

・VideoからVideoへのストリーミング
・Videoからピア接続へのストリーミング
・CanvasからVideoへのストリーム
・Canvasからピア接続へのストリーム
・Canvasからストリームの記録
・コンテンツヒントを使用したビデオエンコーディングのガイド

◎ RTCPeerConnection
ピア接続の制御。

・基本的なピア接続のデモ
・音声のみのピア接続デモ
・帯域幅の変更
・通話をアップグレードしてビデオをオン
・一度に複数のピア接続
・PCの出力を別のPCに転送
・Munge SDPパラメータ
・ピア接続を設定するときにpranswerを使用
・制約と統計
・その他の制約と統計
・さまざまなシナリオのcreateOffer出力の表示
・RTCDTMFSenderの利用
・ピア接続状態を表示
・STUN / TURNサーバから収集するICE候補
・ICEの再起動
・ピア接続への入力としてのWebオーディオ出力
・Webオーディオへの入力としてのピア接続

◎ RTCDataChannel
ピア接続を介して任意のデータを送信。

・テキストの送信
・ファイルの転送
・データの転送
・メッセージング

◎ Video chat
フル機能のWebRTCアプリケーション。

・AppRTCビデオチャットクライアント(Google App Engine)
・AppRTC URLパラメータ

3.  WebRTCのハウリング・エコー対策

・WebRTCで開発者が利用できるオーディオ関連の設定
・Web Audio APIで音声ノイズを軽減する
・WebRTCのMediaStreamをWebAudioAPIのFilterで加工する方法
・WebRTCのノイズキャンセリングについて
・javascript - Web Audio APIを使用してマイク入力のノイズを低減するにはどうすればよいですか？
・カメラとマイクとエンコーダー