27
26

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 5 years have passed since last update.

WebRTCを試すために必要なもの

Last updated at Posted at 2016-01-15

はじめに

WebRTCを使うと、ブラウザで手軽に映像、音声通信が始めることができます。そのために準備する必要があるものを、整理してみます。
(大規模なシステムを作るためには様々な困難が待ち受けていますが、それはまた別のお話)

1. Webブラウザ

何はともあれ、Webブラウザが無いと始まりません。

PCの場合

  • Chrome... Windows, Mac, Linux
  • Firefox... Windows, Mac, Linux

が試しやすいです。こだわり派はOperaでもOKです。
※EdgeでもORTCが使えますが、ややこしいので今回は触れません。また、各種プラグインも出ていますが、それも今回は置いておきます。

モバイルの場合

モバイルでやりたい場合はAndroid版なら利用できます。残念ながらiOS版では利用できません。

  • Chrome... Android
  • Firefox... Android

※iOSでもBowserというブラウザで利用することができますが、それも今回は置いておきます。

ブラウザ以外

ブラウザなくてもできるぞ!という突っ込みがあると思いますが、「試す」レベルではないので今回は除外します。

2. カメラ

WebRTCで一番分かりやすいのは映像の通信です。音声通信もデータ通信もありますが、分かりやすさでは映像に軍配が上がります。

  • PC内蔵のカメラ
  • USBで接続するWebカメラ

のどちらかを用意してください。時々ブラウザから認識できないカメラもありますので、「ドライバ不要」と謳われているカメラが無難です。

3. Webサーバー

ブラウザのWebRTCはJavaScriptから利用することになりますが、ローカルファイル(file://~)ではカメラ/マイクにアクセスすることができません。Webサーバーを用意する必要があります。
※Chrome 47からは、https://~ での利用が必須になりました。が、http://localhost/~ は例外として使えますので、「試す」にはまずはローカルで動かしてみましょう。

Apacheやnginxといったサーバーをセットアップできればそれが良いですが、ハードルが高いなーという人はこちらの「お手軽なWebサーバーの立て方」を参考にしてみてください。

4. シグナリングの手段

WebRTCで通信を行うには、SDPやICE Candidateといったお互いの情報を交換する必要があります。このために何らかのサーバーを用意するのが一般的で、WebSocketなどが利用されます。まず試すにはちょっとハードルが高いのですが、その代わりにあなた自身が手動でシグナリングを行うこともできます。

5. ネットワーク接続

WebRTCで通信を行うには、シグナリングの過程でICE Candidateと呼ばれる通信経路の情報を収集する必要があります。このためには利用するPCがネットワークにつながっている必要があります。たとえ同一PCの中で通信が完結していても、完全にスタンドアローンの状態では ICE Candidate が1つも収集されません。意外な落とし穴ですね。

WiFiでもテザリングでも良いので、PCから外につながるネットワークを用意しましょう。実際の映像や音声の通信はPC内で完結できるので、パケ死することは無いはずです。

※必ずしもインターネットにつながっていなくても、閉じたネットワークでも大丈夫だと思うのですが、確認できていません。

終わりに

WebRTC Conference Japan 2016が開催されます。豪華な特別対談もあります
2日目の2/17に「WebRTC Boot Camp」と題して初心者向けのハンズオンを担当します。
会場のネットワーク接続に制限があるので、ご参加する方はできるだけテザリングやWiFiルーター等をご用意ください(パケ死はしません)。

ご参加お待ちしています!

27
26
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
27
26

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?