WebRTC treft Firefox, Android en iOS

Er is de afgelopen weken veel gebeurd met WebRTC. Tijd voor een update!

We zijn vooral enthousiast om te zien dat WebRTC beschikbaar komt in meerdere browsers en op meerdere platforms.

getUserMedia is nu beschikbaar in Chrome zonder vlaggen, evenals in Opera en Firefox Nightly/Aurora (hoewel je voor Firefox voorkeuren moet instellen ). Bekijk de cross-browser demo van getUserMedia op simpl.info/gum - en bekijk Chris Wilsons verbluffende voorbeelden van het gebruik van getUserMedia als invoer voor webaudio.

webkitRTCPeerConnection is nu beschikbaar in Chrome stable en is vlagloos. TURN-serverondersteuning is beschikbaar in Chrome 24 en hoger. Er is een ultraeenvoudige demo van Chrome's RTCPeerConnection-implementatie op simpl.info/pc en een geweldige videochatapplicatie op apprtc.appspot.com . (Een woordje uitleg over de naam: na verschillende iteraties staat deze momenteel bekend als webkitRTCPeerConnection . Andere namen en implementaties zijn verouderd. Zodra het standaardisatieproces is gestabiliseerd, wordt het webkit voorvoegsel verwijderd.)

WebRTC is nu ook geïmplementeerd voor desktop in Firefox Nightly en Aurora, en voor iOS en Android via de Ericsson Bowser-browser .

DataChannel

DataChannel is een WebRTC API voor peer-to-peercommunicatie met hoge prestaties en lage latentie van willekeurige data. De API is eenvoudig – vergelijkbaar met WebSocket – maar de communicatie vindt rechtstreeks tussen browsers plaats, waardoor DataChannel veel sneller kan zijn dan WebSocket, zelfs als een relayserver (TURN) vereist is (wanneer 'hole punching' om firewalls en NAT's te omzeilen, faalt).

DataChannel is gepland voor versie 25 van Chrome, achter een vlaggetje – hoewel het deze versie mogelijk mist. Dit is alleen bedoeld als experiment, is mogelijk niet volledig functioneel en communicatie met de Firefox-implementatie is niet mogelijk. DataChannel in latere versies zou stabieler moeten zijn en zal worden geïmplementeerd om interactie met DataChannel in Firefox mogelijk te maken.

Firefox Nightly/Aurora ondersteunt mozGetUserMedia , mozRTCPeerConnection en DataChannel (maar vergeet niet uw about:config-voorkeuren in te stellen!)

Hier is een screenshot van DataChannel draaiend in Firefox:

Firefox DataChannel-screenshot

Deze demo is te vinden op http://mozilla.github.com/webrtc-landing/data_test.html . Hier is een codefragment:

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

Meer informatie en demo's voor de Firefox-implementatie zijn beschikbaar op de blog hacks.mozilla.org . Basisondersteuning voor WebRTC wordt begin 2013 in Firefox 18 verwacht en er is ondersteuning gepland voor extra functies, waaronder getUserMedia en createOffer/Answer-beperkingen, evenals TURN (om communicatie tussen browsers achter firewalls mogelijk te maken).

Voor meer informatie over WebRTC, zie Aan de slag met WebRTC . Er is zelfs een WebRTC-boek beschikbaar, zowel in gedrukte vorm als in diverse e-bookformaten.

Resolutiebeperkingen

Beperkingen zijn geïmplementeerd in Chrome 24 en hoger . Deze kunnen worden gebruikt om waarden voor de videoresolutie in te stellen voor getUserMedia() en RTCPeerConnection- addStream() aanroepen.

Er is een voorbeeld te vinden op simpl.info/getusermedia/constraints . Experimenteer met verschillende beperkingen door een breekpunt in te stellen en waarden aan te passen.

Een paar addertjes onder het gras: getUserMedia beperkingen die in één browsertabblad zijn ingesteld, hebben invloed op alle tabbladen die daarna worden geopend. Het instellen van een niet-toegestane waarde voor beperkingen levert een nogal cryptische foutmelding op:

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

Hetzelfde geldt voor de foutmelding als u getUserMedia probeert te gebruiken vanaf het lokale bestandssysteem, en niet vanaf een server!

Streaming schermopname

Tab Capture is nu beschikbaar in het Chrome Dev-kanaal . Dit maakt het mogelijk om het zichtbare gebied van het tabblad vast te leggen als een stream, die vervolgens lokaal of met addStream() van RTCPeerConnection kan worden gebruikt. Dit is erg handig voor sceencasting en het delen van webpagina's. Zie het voorstel voor WebRTC Tab Content Capture voor meer informatie.

Houd ons op de hoogte door een reactie te plaatsen op deze update: we zijn benieuwd wat u met deze API's doet.

...en vergeet niet om eventuele bugs die u tegenkomt te melden op chromiumbugs.appspot.com !