WebRTC działa w Firefoksie, Androidzie i iOS

W ciągu ostatnich kilku tygodni dużo się zmieniło w WebRTC. Czas na aktualizację

Szczególnie cieszymy się na myśl o wprowadzaniu WebRTC w różnych przeglądarkach i na różnych platformach.

getUserMedia jest teraz dostępny w Chrome bez flag, a także w przeglądarkach Opera i Firefox Nightly/Aurora (ale w przypadku Firefoksa musisz ustawić preferencje). Zapoznaj się z wersją demonstracyjną getUserMedia w różnych przeglądarkach na stronie simpl.info/gum i zapoznaj się z niezwykłymi przykładami wykorzystania getUserMedia jako danych wejściowych dla Web Audio autorstwa Chrisa Wilsona.

Aplikacja webkitRTCPeerConnection jest teraz stabilna w Chrome i nie ma flagi. Obsługa serwera TURN jest dostępna w Chrome 24 i nowszych wersjach. Na stronie simpl.info/pc znajdziesz bardzo prostą prezentację wdrożenia RTCPeerConnection w Chrome oraz świetna aplikacja do czatów wideo na stronie apprtc.appspot.com. (Kilka słów o tej nazwie nosi obecnie nazwę webkitRTCPeerConnection). Inne nazwy i implementacje zostały wycofane. Po ustabilizowaniu się procesu standardowego prefiks webkit zostanie usunięty.

WebRTC został też wdrożony na komputerach w przeglądarkach Firefox Nightly i Aurora oraz na iOS i Androida za pomocą przeglądarki Bowser firmy Ericsson.

DataChannel

DataChannel to interfejs API WebRTC służący do obsługi wysokiej wydajności, małych opóźnień i komunikacji peer-to-peer dowolnych danych. Interfejs API jest podobny do WebSocket, ale komunikacja odbywa się bezpośrednio między przeglądarkami, więc DataChannel może być znacznie szybsza niż WebSocket nawet wtedy, gdy wymagany jest serwer przekazujący (TURN) w celu radzenia sobie z zaporami sieciowymi i kodami NAT.

DataChannel jest już planowana na Chrome w wersji 25. Niestety, ta wersja może być niedostępna w tej wersji. Nastąpi to tylko w celu eksperymentowania i może nie być w pełni funkcjonalne, a implementacja przeglądarki Firefox nie będzie możliwa. W nowszych wersjach funkcja DataChannel powinna być bardziej stabilna i zostanie zaimplementowany, by umożliwić interakcję z DataChannel w przeglądarce Firefox.

Firefox Nightly/Aurora obsługuje mozGetUserMedia, mozRTCPeerConnection i DataChannel (nie zapomnij określić ustawień about:config).

Oto zrzut ekranu DataChannel, który działa w Firefoksie:

Zrzut ekranu kanału Firefox DataChannel

Wersja demonstracyjna dostępna jest pod adresem http://mozilla.github.com/webrtc-landing/data_test.html. Oto fragment kodu:

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);
        }

Więcej informacji i prezentacje dotyczące implementacji Firefoksa znajdziesz na blogu hacks.mozilla.org. Na początku 2013 r. wprowadzimy podstawową obsługę WebRTC w przeglądarce Firefox 18. Planujemy też wprowadzenie obsługi dodatkowych funkcji, takich jak getUserMedia, ograniczenia tworzenia ofert/odpowiedzi oraz TURN (umożliwiają komunikację między przeglądarkami za zaporami sieciowymi).

Więcej informacji o WebRTC znajdziesz w artykule Pierwsze kroki z WebRTC. Dostępna jest nawet książka z WebRTC dostępna w wersji drukowanej i w kilku formatach e-booków.

Ograniczenia rozdzielczości

Ograniczenie zostało wdrożone w Chrome w wersji 24 i nowszych. Można ich używać do ustawiania wartości rozdzielczości wideo dla wywołań getUserMedia() i RTCPeerConnection addStream().

Przykład znajdziesz na stronie simpl.info/getusermedia/constraints. Wypróbuj różne ograniczenia, ustawiając punkt przerwania i dostosowując wartości.

Kilka łap... Ograniczenia getUserMedia ustawione na 1 karcie przeglądarki wpływają na ograniczenia wszystkich kart otwieranych w późniejszym czasie. Ustawienie niedozwolonej wartości ograniczeń powoduje wyświetlenie dość niejasnego komunikatu o błędzie:

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

Błąd pojawia się też wtedy, gdy próbujesz użyć pliku getUserMedia z lokalnego systemu plików, a nie z serwera.

Przesyłam strumieniowo zrzuty ekranu

Przechwytywanie kart jest teraz dostępne w wersji deweloperskiej Chrome. Dzięki temu widoczny obszar karty jest widoczny jako strumień, którego można używać lokalnie lub za pomocą parametru addStream() RTCPeerConnection. Bardzo przydatna przy sceencastingu i udostępnianiu stron internetowych. Więcej informacji znajdziesz w ofercie pakietowej dotyczącej przechwytywania treści na karcie WebRTC.

Powiadom nas o tym, komentując tę aktualizację. Chętnie poznamy Twoją opinię na temat tych interfejsów API.

...i nie zapomnij zgłosić błędów na chromiumbugs.appspot.com.