JSFiddle - React, Tailwind, and code Playground
HTML
<script src='https://webrtc.github.io/adapter/adapter-0.2.4.js'></script>
JavaScript
var pc1 = new RTCPeerConnection(null);
var pc2 = new RTCPeerConnection(null);
var addCandidate = function(pc, event) {
if (!event.candidate) {
return;
}
var cand = new RTCIceCandidate(event.candidate);
pc.addIceCandidate(cand).then(function() {
}).catch(function(err) {
});
};
pc1.onicecandidate = function(event) {
addCandidate(pc2, event);
};
pc2.onicecandidate = function(event) {
addCandidate(pc1, event);
};
function pause(ms) {
return new Promise(function (resolve) {
setTimeout(resolve, ms);
});
}
pc1.createDataChannel('test');
return pc1.createOffer().then(function(offer) {
console.log('pc1 offer:\n', offer.sdp);
return pc1.setLocalDescription(offer);
}).then(function() {
return pc2.setRemoteDescription(pc1.localDescription);
}).then(function() {
return pc2.createAnswer();
}).then(function(answer) {
console.log('pc2 answer:\n', answer.sdp);
return pc2.setLocalDescription(answer);
}).then(function() {
return pc1.setRemoteDescription(pc2.localDescription);
}).then(function() {
console.log('Finished first negotiation.');
console.log('Pausing for 1s before renegotiating');
return pause(1000);
}).then(function () {
return pc2.createOffer();
}).then(function(offer) {
console.log('pc2 renegotiation offer:\n', offer.sdp);
return pc2.setLocalDescription(offer);
}).then(function() {
return pc1.setRemoteDescription(pc2.localDescription);
}).then(function() {
return pc1.createAnswer();
}).then(function (answer) {
console.log('pc1 renegotiation answer:\n', answer.sdp);
return pc2.setRemoteDescription(answer);
}).then(function () {
console.log('Renegotiated');
}).catch(function(err) {
console.log('Error', err);
});