WebRTC treft Firefox, Android en iOS

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

We zijn vooral erg enthousiast om te zien dat WebRTC op meerdere browsers en platforms verschijnt.

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

webkitRTCPeerConnection is nu stabiel in Chrome en is vlagloos. TURN-serverondersteuning is beschikbaar in Chrome 24 en hoger. Er is een ultraeenvoudige demo van de RTCPeerConnection-implementatie van Chrome 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. Wanneer het standaardproces 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 .

Gegevenskanaal

DataChannel is een WebRTC API voor hoogwaardige, peer-to-peer-communicatie met lage latentie van willekeurige gegevens. De API is eenvoudig en lijkt op WebSocket - maar de communicatie vindt rechtstreeks tussen browsers plaats, dus DataChannel kan veel sneller zijn dan WebSocket, zelfs als een relay-server (TURN-server) vereist is (wanneer 'perforeren' om met firewalls en NAT's om te gaan mislukt).

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

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

Hier is een screenshot van DataChannel in Firefox:

Firefox DataChannel-screenshot

Deze demo staat 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 . De basisondersteuning voor WebRTC wordt begin 2013 verwacht in Firefox 18, en ondersteuning is gepland voor aanvullende functies, waaronder getUserMedia en createOffer/Answer-beperkingen, evenals TURN (om communicatie tussen browsers achter firewalls mogelijk te maken).

Zie Aan de slag met WebRTC voor meer informatie over WebRTC. Er is zelfs een WebRTC-boek , beschikbaar in gedrukte vorm en in verschillende eBook-formaten.

Resolutiebeperkingen

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

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

Een paar valkuilen... getUserMedia beperkingen die op één browsertabblad zijn ingesteld, hebben invloed op de beperkingen voor alle tabbladen die vervolgens worden geopend. Het instellen van een niet-toegestane waarde voor beperkingen geeft een nogal cryptische foutmelding:

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

Hetzelfde geldt voor de fout als u getUserMedia probeert te gebruiken vanuit het lokale bestandssysteem, niet op 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 kan worden gebruikt, of met addStream() van RTCPeerConnection. Zeer handig voor sceencasting en het delen van webpagina's. Voor meer informatie zie het WebRTC Tab Content Capture-voorstel .

Houd ons op de hoogte door op deze update te reageren: we horen graag wat u met deze API's doet.

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