読者です 読者をやめる 読者になる 読者になる

shimada-kの日記

ソフトウェア・エンジニアのブログです

Temasysを使ってSafari@OSXでWebRTC

WebRTC Meetup Tokyo #2に行ってきました。

WebRTCの仕様の策定状況やブラウザ間のサポートの差異をどうしようかみたいな話を聞いてきました。

WebRTCはChrome/FireFox(Opera)は対応してるんですが、Safariやシェアのほとんどを占めているIEなどは対応してないわけです。

そこでブラウザの壁を超えるための手段としてTemasysが紹介されていました。

Temasysはブラウザのプラグインとして配布されていて、さらにTemasysCommunicationsが配布しているadapter.jsを組み込むとgetUserMediaが使用可能になります。今回はOSX用のプラグインをインストールしてSafariで試してみました。

TemasysCommunications/Google-WebRTC-Samples

上記プロジェクトはGoogleリポジトリからforkされていてadapter.jsは本家のものをTemasysプラグイン用に書き換えたものになっています。

getUserMedia

ブラウザで開くと最初にプラグインを有効にするかどうかとカメラへのアクセスの許可のポップアップが出現します(この辺は本家のWebRTCと似てます)

ポップアップをすべてOKするとちゃんとブラウザ上でストリーミングが再生されます。

f:id:shimada-k:20140604225417p:plain

PeerConnection

ローカルストリームでPeer通信をするサンプルです。

f:id:shimada-k:20140604225437p:plain

画像では分かりませんが、音声と動画が映っています。しかしこのサンプルはadapter.js(2014/06/05修正)main.jsのperformance.now()がsafariではサポートされてないので動かすにはDate.now()に書き換えが必要でした。

MDN Performance.now()

function call() {
  callButton.disabled = true;
  hangupButton.disabled = false;
  trace('Starting call');
  //startTime = performance.now();    // ここをコメントアウト
  startTime = Date.now();    // Date.now()に書き換える

この他にもvideoタグはdivで囲ってあることが前提になっていたり、そもそもSafariではwindow.URL.createObjectURLが使えなかったりと、Chrome/Firefoxで動いているものをそのまま動かすにはまだ多くの壁が残っているような気がします。

WebRTCは単体でも面白いんですが、ARや3Dや位置情報とかと組み合わせるともっと面白いと思っているので、今後仕様の策定が進んで特にモバイル環境で環境気にせず動くようになることを期待したいです。

Safariしか試してませんがIEでも動くはずです(たぶん)。