概要

最近、WebRTCを用いて動画の配信をしてみたのですが、使用するブラウザのバージョンによってはAPIの名前に違いがあるようで、その対応方法について紹介します。

環境

今回対応するのは、ChromeとFirefoxです。一応、Microsoft Edgeにも対応するように書いてはいますが、本当に動くかは確認していません。

対応

私がWebRTCで動画の配信をする時に使用したAPIは、RTCPeerConnectionRTCSessionDescriptionRTCIceCandidateの3つです。

この3つのAPIについて各ブラウザで動くようにします。

対応する方法は、ブラウザそれぞれのプレフィックスをつけてAPIを呼び出し、APIがない場合はundefinedとなるのでそれを元に使えるAPIを判定し処理をします。

3つのAPIでこのようになります。

var RTCPeerConnection = window.RTCPeerConnection || window.webkitRTCPeerConnection || window.mozRTCPeerConnection || window.msRTCPeerConnection;

var RTCSessionDescription = window.RTCSessionDescription || window.webkitRTCSessionDescription || window.mozRTCSessionDescription || window.msRTCSessionDescription;

var RTCIceCandidate = window.RTCIceCandidate || window.webkitRTCIceCandidate || window.mozRTCIceCandidate || window.msRTCIceCandidate;

あとは、new RTCPeerConnection()のようにしてAPIを使用します。

まとめ

最近のブラウザでは、各ブラウザのプレフィックスをつけなくても動作するようですが、少し古いブラウザではプレフィックスがないと動作しないようです。

なので、まだまだこのようにして対応していく必要があります。