getUserMedia теперь доступен

За последние время много нового произошло с WebRTC. Теперь WebRTC работает в нескольких браузерах и платформах. getUserMedia доступен теперь в Chrome, Opera, Firefox и Nightly/Aurora (для Firefox необходимо установить так называемые предпочтения).
Демо
В настоящее время WebRTC также работает на рабочем столе в Firefox Nightly и Aurora, и для IOS и Android с помощью браузера Ericsson Bowser.

Datachannel

DataChannel является API WebRTC, который обеспечивает высокую производительность, низкую латентность, peer-to-peer связи arbritary данных. Это простая API, похожая на WebSocket , но обмен данными происходит непосредственно между браузерами, поэтому DataChannel намного быстрее, чем WebSocket .

Для эксперимента, планируется добавить DataChannel в Chrome 25, в дополнениях но DataChannel пока не будет полностью функциональным, и не будет поддерживаться по умолчанию в Firefox. В более новых версиях браузеров DataChannel будет более стабильным и тогда осуществится взаимодействие DataChannel в Firefox.

Firefox Nightly/Aurora поддерживает mozGetUserMedia, mozRTCPeerConnection и DataChannel (но не забудьте настроить about:config так называемые, предпочтения!)

Работа DataChannel в Firefox:
Демо
Вот фрагмент кода:



pc1.onconnection = function() {
  log("pc1 onConnection ");
  dc1 = pc1.createDataChannel("This is pc1",{}); // reliable (TCP-like)
  dc1 = pc1.createDataChannel("This is pc1",{outOfOrderAllowed: true, maxRetransmitNum: 0}); // unreliable (UDP-like)
  log("pc1 created channel " + dc1 + " binarytype = " + dc1.binaryType);
  channel = dc1;
  channel.binaryType = "blob";
  log("pc1 new binarytype = " + dc1.binaryType);

  // Since we create the datachannel, don't wait for onDataChannel!
  channel.onmessage = function(evt) {
    if (evt.data instanceof Blob) {
      fancy_log("*** pc2 sent Blob: " + evt.data + ", length=" + evt.data.size,"blue");
    } else {
      fancy_log('pc2 said: ' + evt.data, "blue");
    }
  }
  channel.onopen = function() {
    log("pc1 onopen fired for " + channel);
    channel.send("pc1 says Hello...");
    log("pc1 state: " + channel.state);
  }
  channel.onclose = function() {
    log("pc1 onclose fired");
  };
  log("pc1 state:" + channel.readyState);
      }


Более подробная информация о демо для осуществления в Firefox доступна на странице блога hacks.mozilla.org. Основная поддержка WebRTC выйдет в новой версии Firefox 18. Версия Firefox 18 планируется выйти в начале 2013 года. В Firefox 18 войдёт: поддержка дополнительных функций, включая  getUserMedia  и createOffer/Answer, а также TURN (для обеспечения связи между браузерами, защищенных фаерволом).

Разрешить ограничения

Ограничения были реализованы начиная с Chrome 24. Они могут быть использованы для установки значений для разрешения видео для getUserMedia()  и вызова RTCPeerConnection addStream() .

,Поэкспериментируйте в демо примере с различными ограничениями, установив точки останова и настройки значений.

getUserMedia ограничения, установленные вкладки в браузере влияют на ограничения для всех вкладок, открытых после. Установка запрещающая значение для ограничения, выдаёт очень загадочное сообщение об ошибке:



navigator.getUserMedia error:  NavigatorUserMediaError {code: 1, PERMISSION_DENIED: 1}


Точно такая же ошибка будет, если вы пытаетесь использовать getUserMedia на локалке, а не на веб-сервере!

Поток захвата экрана

Вкладка Capture теперь доступна в Chrome. Это дает возможность захвата видимую область вкладки в виде потока, который затем может использоваться локально или с RTCPeerConnection в  addStream() . Очень полезно для sceencasting и обмена веб-страницами.

В заключение

Держите нас в курсе, комментируя эту запись: нам интересно знать, что вы делаете с этими API. А также пишите о любых ошибках, в результате с которыми вы столкнулись!

Добавить комментарий

Ваш e-mail не будет опубликован. Обязательные поля помечены *

Можно использовать следующие HTML -теги и атрибуты: <a href= http://pixelcom.crimea.ua/"" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>