-
-
Save p13i/51342c2e54311f4916bbd7efd4b032f4 to your computer and use it in GitHub Desktop.
Creating RTCPeerConnection
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<!DOCTYPE html> | |
<html lang="en"> | |
<head> | |
<meta charset="UTF-8"> | |
<title>Creating RTCPeerConnection</title> | |
<style> | |
body { | |
background-color: #3D6DF2; | |
margin-top: 15px; | |
} | |
video { | |
background: black; | |
border: 1px solid gray; | |
} | |
#container { | |
position: relative; | |
display: block; | |
margin: 0 auto; | |
width: 500px; | |
height: 500px; | |
} | |
#yours { | |
width: 150px; | |
height: 150px; | |
position: absolute; | |
top: 15px; | |
right: 15px; | |
} | |
#theirs { | |
width: 500px; | |
height: 500px; | |
} | |
</style> | |
</head> | |
<body> | |
<div id="container"> | |
<video id="yours" autoplay></video> | |
<video id="theirs" autoplay></video> | |
</div> | |
<script src="main.js"></script> | |
</body> | |
</html> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
function hasUserMedia() { | |
navigator.getUserMedia = navigator.getUserMedia || navigator.webkitGetUserMedia || navigator.mozGetUserMedia || navigator.msGetUserMedia; | |
return !!navigator.getUserMedia; | |
} | |
function hasRTCPeerConnection() { | |
window.RTCPeerConnection = window.RTCPeerConnection || window.webkitRTCPeerConnection || window.mozRTCPeerConnection; | |
return !!window.RTCPeerConnection; | |
} | |
var yourVideo = document.querySelector('#yours'), | |
theirVideo = document.querySelector('#theirs'), | |
yourConnection, theirConnection; | |
if (hasUserMedia()) { | |
navigator.getUserMedia({ video: true, audio: false }, function (stream) { | |
yourVideo.src = window.URL.createObjectURL(stream); | |
if (hasRTCPeerConnection()) { | |
startPeerConnection(stream); | |
} else { | |
alert("Sorry, your browser does not support WebRTC."); | |
} | |
}, function (error) { | |
console.log(error); | |
}); | |
} else { | |
alert("Sorry, your browser does not support WebRTC."); | |
} | |
function startPeerConnection(stream) { | |
var configuration = { | |
"iceServers": [{ "url": "stun:192.168.1.100:9876" }] // this is address of a local server | |
}; | |
yourConnection = new mozRTCPeerConnection(configuration); | |
theirConnection = new mozRTCPeerConnection(configuration); | |
console.log(theirConnection); | |
// Setup stream listening | |
yourConnection.addStream(stream); | |
theirConnection.onaddstream = function (e) { | |
theirVideo.src = window.URL.createObjectURL(e.stream); | |
}; | |
// Setup ice handling | |
yourConnection.onicecandidate = function (event) { | |
if (event.candidate) { | |
theirConnection.addIceCandidate(new RTCIceCandidate(event.candidate)); | |
} | |
}; | |
theirConnection.onicecandidate = function (event) { | |
if (event.candidate) { | |
yourConnection.addIceCandidate(new RTCIceCandidate(event.candidate)); | |
} | |
}; | |
function error () { console.log('There was an error'); }; | |
yourConnection.createOffer(function (offer) { console.log('Offer:'); console.log(offer); | |
yourConnection.setLocalDescription(offer); | |
theirConnection.setRemoteDescription(offer); | |
theirConnection.createAnswer(function (answer) { console.log('Answer:'); console.log(answer); | |
theirConnection.setLocalDescription(answer); | |
yourConnection.setRemoteDescription(answer); | |
}, error); | |
}, error); | |
}; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
var http = require("http"); | |
http.createServer(function(request, response) { | |
response.writeHeader(200, {"Content-Type": "text/html"}); | |
response.end(); | |
}).listen(2020, function() { | |
console.log('Server started at port 2020'); | |
}); |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment