WebRTC-モバイルサポート

モバイルの世界では、WebRTCサポートはデスクトップと同じレベルではありません。モバイルデバイスには独自の方法があるため、WebRTCはモバイルプラットフォーム上でも異なるものです。

デスクトップ用のWebRTCアプリケーションを開発するときは、Chrome、Firefox、またはOperaの使用を検討します。それらはすべて、そのままWebRTCをサポートします。一般に、デスクトップのハードウェアに煩わされるのではなく、ブラウザが必要なだけです。

モバイルの世界では、今日のWebRTCには3つのモードがあります-

ネイティブアプリケーション
ブラウザアプリケーション
ネイティブブラウザ

アンドロイド

2013年、Android向けのFirefox Webブラウザには、すぐにWebRTCサポートが提供されました。 Firefoxモバイルブラウザを使用して、Androidデバイスでビデオ通話を行うことができるようになりました。

3つの主要なWebRTCコンポーネントがあります-

PeerConnection -ブラウザ間の呼び出しを有効にします
getUserMedia -カメラとマイクへのアクセスを提供します
DataChannels -ピアツーピアのデータ転送を提供します

Android向けGoogle ChromeはWebRTCサポートも提供します。既にお気づきのように、最も興味深い機能は通常Chromeに最初に表示されます。

過去1年で、OperaモバイルブラウザがWebRTCサポート付きで登場しました。 AndroidにはChrome、Firefox、Operaがあります。他のブラウザはWebRTCをサポートしていません。

iOS

残念ながら、WebRTCは現在iOSではサポートされていません。 Firefox、Opera、またはChromeを使用する場合、WebRTCはMacで正常に動作しますが、iOSではサポートされていません。

最近では、WebRTCアプリケーションはそのままではAppleモバイルデバイスで動作しません。しかし、ブラウザがあります-クッパ。これは、エリクソンが開発したWebブラウザーであり、そのままWebRTCをサポートします。ホームページはhttp://www.openwebrtc.org/bowser/[[[1]]]で確認できます。

今日、これはiOSでWebRTCアプリケーションをサポートする唯一の友好的な方法です。別の方法は、ネイティブアプリケーションを自分で開発することです。

Windows Phone

Microsoftは、モバイルプラットフォームでWebRTCをサポートしていません。しかし、IEの将来のバージョンでORTC（Object Realtime Communications）を実装することを公式に確認しています。 WebRTC 1.0をサポートする予定はありません。彼らはORTCにWebRTC 1.1というラベルを付けましたが、これは単なるコミュニティの拡張機能であり、公式の標準ではありません。

そのため、今日のWindow PhoneユーザーはWebRTCアプリケーションを使用できず、この状況に勝つ方法はありません。

ブラックベリー

WebRTCアプリケーションは、Blackberryでもサポートされていません。

WebRTCネイティブブラウザーの使用

ユーザーがWebRTCを利用するための最も便利で快適なケースは、デバイスのネイティブブラウザーを使用することです。この場合、デバイスは追加の構成を使用する準備ができています。

現在、バージョン4以降のAndroidデバイスのみがこの機能を提供しています。 AppleはまだWebRTCサポートのアクティビティを表示していません。そのため、SafariユーザーはWebRTCアプリケーションを使用できません。また、MicrosoftはWindows Phone 8でも導入していません。

ブラウザアプリケーション経由でWebRTCを使用する

これは、WebRTC機能を提供するために、サードパーティアプリケーション（非ネイティブWebブラウザー）を使用することを意味します。今のところ、このようなサードパーティのアプリケーションが2つあります。 Bowserは、WebRTC機能をiOSデバイスとOperaに提供する唯一の方法であり、Androidプラットフォームの優れた代替手段です。残りの利用可能なモバイルブラウザーはWebRTCをサポートしていません。

ネイティブモバイルアプリケーション

ご覧のとおり、WebRTCはまだモバイルの世界で大きなサポートを提供していません。したがって、可能な解決策の1つは、WebRTC APIを利用するネイティブアプリケーションを開発することです。しかし、メインのWebRTC機能はクロスプラットフォームソリューションであるため、これは良い選択ではありません。とにかく、場合によっては、ネイティブアプリケーションがHTML5ブラウザーでサポートされていないデバイス固有の機能を利用できるため、これが唯一の方法です。

モバイルおよびデスクトップデバイスのビデオストリームの制約

getUserMedia APIの最初のパラメーターは、ブラウザーにストリームの処理方法を指示するキーと値のオブジェクトを想定しています。 https://tools.ietf.org/html/draft-alvestrand-constraints-resolutionですべての制約を確認できます。 -03。ビデオのアスペクト比、frameRate、およびその他のオプションのパラメーターを設定できます。

モバイルデバイスの画面スペースは限られており、リソースも限られているため、モバイルデバイスのサポートは最大の苦痛の1つです。消費電力と帯域幅を節約するために、モバイルデバイスで解像度480x320またはそれより小さいビデオストリームのみをキャプチャしたい場合があります。ブラウザでユーザーエージェント文字列を使用すると、ユーザーがモバイルデバイスを使用しているかどうかをテストできます。例を見てみましょう。 _indexl_ファイルを作成します-

<!DOCTYPE html>
<html lang = "en">

   <head>
      <meta charset = "utf-8"/>
   </head>

   <body>
      <video autoplay></video>
      <script src = "client.js"></script>
   </body>

</html>

その後、次の_client.js_ファイルを作成します-

//constraints for desktop browser
var desktopConstraints = {

   video: {
      mandatory: {
         maxWidth:800,
         maxHeight:600
      }
   },

   audio: true
};

//constraints for mobile browser
var mobileConstraints = {

   video: {
      mandatory: {
         maxWidth: 480,
         maxHeight: 320,
      }
   },

   audio: true
}

//if a user is using a mobile browser
if(/Android|iPhone|iPad/i.test(navigator.userAgent)) {
   var constraints = mobileConstraints;
} else {
   var constraints = desktopConstraints;
}

function hasUserMedia() {
  //check if the browser supports the WebRTC
   return !!(navigator.getUserMedia || navigator.webkitGetUserMedia ||
      navigator.mozGetUserMedia);
}

if (hasUserMedia()) {

   navigator.getUserMedia = navigator.getUserMedia || navigator.webkitGetUserMedia ||
      navigator.mozGetUserMedia;

  //enabling video and audio channels
   navigator.getUserMedia(constraints, function (stream) {
      var video = document.querySelector('video');

     //inserting our stream to the video tag
      video.src = window.URL.createObjectURL(stream);

   }, function (err) {});
} else {
   alert("WebRTC is not supported");
}

_static_コマンドを使用してWebサーバーを実行し、ページを開きます。 800x600になっているはずです。次に、クロムツールを使用してこのページをモバイルビューポートで開き、解像度を確認します。 480x320である必要があります。

Webサーバーの実行

制約は、WebRTCアプリケーションのパフォーマンスを向上させる最も簡単な方法です。

概要

この章では、モバイルデバイス用のWebRTCアプリケーションを開発するときに発生する可能性のある問題について学びました。モバイルプラットフォームでWebRTC APIをサポートする場合のさまざまな制限を発見しました。また、デスクトップブラウザとモバイルブラウザにさまざまな制約を設定するデモアプリケーションを起動しました。

Webrtc-mobile-support

目次