WebRTC - 移动支持

在移动世界中，WebRTC支持与桌面上的支持不同.移动设备有自己的方式，因此WebRTC在移动平台上也有所不同.

在为桌面开发WebRTC应用程序时，我们考虑使用Chrome，Firefox或Opera.所有这些都支持开箱即用的WebRTC.一般来说，你只需要一个浏览器而不用担心桌面的硬件.

在移动世界中，今天WebRTC有三种可能的模式 :

• 本机应用程序

• 浏览器应用程序

• 本机浏览器

Android

2013年，Android的Firefox网络浏览器提供了开箱即用的WebRTC支持.现在，您可以使用Firefox移动浏览器在Android设备上进行视频通话.

它有三个主要的WebRTC组件 :

• PeerConnection : 启用浏览器之间的通话

• getUserMedia :

• DataChannels : 提供点对点数据传输

Google Chrome for Android也提供WebRTC支持.正如您已经注意到的，最有趣的功能通常首先出现在Chrome中.

在过去的一年中，Opera移动浏览器出现了WebRTC支持.因此，对于Android，您可以使用Chrome，Firefox和Opera.其他浏览器不支持WebRTC.

iOS

不幸的是，iOS现在不支持WebRTC.尽管WebRTC在使用Firefox，Opera或Chrome时在Mac上运行良好，但iOS上不支持它.

现在，您的WebRTC应用程序无法在Apple移动设备上运行.但是有一个浏览器 : 去;库巴.它是由爱立信开发的Web浏览器，它支持开箱即用的WebRTC.您可以在 http://www.openwebrtc.org/bowser/上查看其主页.

今天，它是在iOS上支持WebRTC应用程序的唯一友好方式.另一种方法是自己开发本机应用程序.

Windows手机

Microsoft不支持移动平台上的WebRTC.但他们已经正式确认他们将在IE的未来版本中实施ORTC(对象实时通信).他们不打算支持WebRTC 1.0.他们将他们的ORTC标记为WebRTC 1.1，虽然它只是一个社区增强而不是官方标准.

所以今天Window Phone用户无法使用WebRTC应用程序而且无法击败这种情况.

Blackberry

Blackberry也不支持WebRTC应用程序.

使用WebRTC本机浏览器

用户使用WebRTC最方便，最舒适的情况是使用设备的本机浏览器.在这种情况下，设备已准备好进行任何其他配置.

今天只有版本为4或更高版本的Android设备才能提供此功能. Apple仍未显示WebRTC支持的任何活动.因此Safari用户无法使用WebRTC应用程序.微软也没有在Windows Phone 8中引入它.

通过浏览器应用程序使用WebRTC

这意味着使用第三方应用程序(非本机) Web浏览器)以提供WebRTC功能.目前，有两个这样的第三方应用程序. Bowser，这是将WebRTC功能引入iOS设备和Opera的唯一方法，这是Android平台的一个不错的选择.其余可用的移动浏览器不支持WebRTC.

原生移动应用程序

如您所见，WebRTC没有大量支持在移动世界中.因此，可能的解决方案之一是开发利用WebRTC API的本机应用程序.但它不是更好的选择，因为主要的WebRTC功能是跨平台解决方案.无论如何，在某些情况下，这是唯一的方法，因为本机应用程序可以利用HTML5浏览器不支持的特定于设备的功能或功能.

限制移动和桌面设备的视频流

getUserMedia API的第一个参数需要一个键和值对象告诉浏览器如何处理流.您可以在 https:/中查看完整的约束集./tools.ietf.org/html/draft-alvestrand-constraints-resolution-03.您可以设置视频宽高比，frameRate和其他可选参数.

支持移动设备设备是最大的痛苦之一，因为移动设备的屏幕空间有限，资源有限.您可能希望移动设备仅捕获480x320分辨率或更小的视频流，以节省功耗和带宽.在浏览器中使用用户代理字符串是测试用户是否在移动设备上的好方法.我们来看一个例子吧.创建 index.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.然后使用chrome工具在移动视口中打开此页面并检查分辨率.它应该是480x320.

约束是提高WebRTC应用程序性能的最简单方法.

摘要

在本章中，我们了解了开发WebRTC应用程序时可能出现的问题适用于移动设备.我们发现在移动平台上支持WebRTC API的不同限制.我们还推出了一个演示应用程序，我们为桌面和移动浏览器设置了不同的约束.