网页上如何使用WebRTC

这是一段简单的代码,关于HTML5的WebRTC技术,主要描述了如何使用RTCPeerConnection的步骤 .
代码地址: https://github.com/samdutton/simpl/blob/master/rtcpeerconnection/js/main.js
Demo地址: http://www.simpl.info/rtcpeerconnection/

标签： WebRTC

代码片段(1)

[代码] [JavaScript]代码

001	performance.now = performance.now || performance.webkitNow; // hack added by SD!

002

003	//var vid1 = document.getElementById("vid1");

004	//var vid2 = document.getElementById("vid2");

005	btn1.disabled = false;

006	btn2.disabled = true;

007	btn3.disabled = true;

008	var localstream;

009

010	function trace(text) {

011	// This function is used for logging.

012	if (text[text.length - 1] == '\n') {

013	text = text.substring(0, text.length - 1);

014

}

015	console.log((performance.now() / 1000).toFixed(3) + ": " + text);

016

}

017

018	function gotStream(stream){

019	trace("Received local stream");

020	vid1.src = webkitURL.createObjectURL(stream);

021	localstream = stream;

022	btn2.disabled = false;

023

}

024

025	function start() {

026	trace("Requesting local stream");

027	btn1.disabled = true;

028	navigator.webkitGetUserMedia({audio:true, video:true},

029	gotStream, function() {});

030

}

031

032	function call() {

033	btn2.disabled = true;

034	btn3.disabled = false;

035	trace("Starting call");

036

037	// temporary hacks to cope with API change

038	if (!!localstream.videoTracks && !localstream.getVideoTracks) {

039	localstream.getVideoTracks = function(){

040	return this.videoTracks;

041

}

042

}

043	if (!!localstream.audioTracks && !localstream.getAudioTracks) {

044	localstream.getAudioTracks = function(){

045	return this.audioTracks;

046

}

047

}

048

///

049

050	if (localstream.getVideoTracks().length > 0)

051	trace('Using Video device: ' + localstream.getVideoTracks()[0].label);

052	if (localstream.getAudioTracks().length > 0)

053	trace('Using Audio device: ' + localstream.getAudioTracks()[0].label);

054	var servers = null;

055	window.pc1 = new webkitRTCPeerConnection(servers);

056	trace("Created local peer connection object pc1");

057	pc1.onicecandidate = iceCallback1;

058	window.pc2 = new webkitRTCPeerConnection(servers);

059	trace("Created remote peer connection object pc2");

060	pc2.onicecandidate = iceCallback2;

061	pc2.onaddstream = gotRemoteStream;

062

063	pc1.addStream(localstream);

064	trace("Adding Local Stream to peer connection");

065

066	pc1.createOffer(gotDescription1);

067

}

068

069	function gotDescription1(desc){

070	pc1.setLocalDescription(desc);

071	trace("Offer from pc1 \n" + desc.sdp);

072	pc2.setRemoteDescription(desc);

073	pc2.createAnswer(gotDescription2);

074

}

075

076	function gotDescription2(desc){

077	pc2.setLocalDescription(desc);

078	trace("Answer from pc2 \n" + desc.sdp);

079	pc1.setRemoteDescription(desc);

080

}

081

082	function hangup() {

083	trace("Ending call");

084	pc1.close();

085	pc2.close();

086	pc1 = null;

087	pc2 = null;

088	btn3.disabled = true;

089	btn2.disabled = false;

090

}

091

092	function gotRemoteStream(e){

093	vid2.src = webkitURL.createObjectURL(e.stream);

094	trace("Received remote stream");

095

}

096

097	function iceCallback1(event){

098	if (event.candidate) {

099	pc2.addIceCandidate(new RTCIceCandidate(event.candidate));

100	trace("Local ICE candidate: \n" + event.candidate.candidate);

101

}

102

}

103

104	function iceCallback2(event){

105	if (event.candidate) {

106	pc1.addIceCandidate(new RTCIceCandidate(event.candidate));

107	trace("Remote ICE candidate: \n " + event.candidate.candidate);

108

}

109

}