I’m unable to create a video link, the link receives, but does not display:

HTML:

<video id="localVideo" width="360" height="240" autoplay="true"></video> <video id="remoteVideo" width="360" height="240" autoplay="true"></video>

Js:

 var peerConnection = window.RTCPeerConnection || window.mozRTCPeerConnection || window.webkitRTCPeerConnection || window.msRTCPeerConnection; var sessionDescription = window.RTCSessionDescription || window.mozRTCSessionDescription || window.webkitRTCSessionDescription || window.msRTCSessionDescription; navigator.getUserMedia = navigator.getUserMedia || navigator.mozGetUserMedia || navigator.webkitGetUserMedia || navigator.msGetUserMedia; var onePeer = new peerConnection(); var twoPeer = new peerConnection(); onePeer.onaddstream = function(obj) { document.getElementById("localVideo").src = window.URL.createObjectURL(obj.stream); } function error(err) { //Error } function initialize() { navigator.getUserMedia( {video:true}, function(stream){ onePeer.onaddstream({stream: stream}); onePeer.addStream(stream); onePeer.createOffer(function(offer) { onePeer.setLocalDescription(new sessionDescription(offer), function() { // Пытаюсь принять: remote(offer); }, error); }, error); }, function(error){console.log("Failed to get access to local media. Error code was " + error.code);} ); } //Получает ссылку - но не отображает, почему? twoPeer.onaddstream = function(obj) {document.getElementById("remoteVideo").src = window.URL.createObjectURL(obj.stream);}; function remote(obj) { twoPeer.setRemoteDescription(new sessionDescription(obj), function() { twoPeer.createAnswer(function(answer) { twoPeer.setLocalDescription(new sessionDescription(answer), function() { // ANSWER }, error); }, error); }, error); } setTimeout(initialize, 1);

The console gives the error:

ICE failed, see about: webrtc for more details

  • Did you do what is written in the error message? - D-side

1 answer 1

SDP exchange is not sufficient to establish a connection, you must implement the ICE exchange of candidates https://developer.mozilla.org/en-US/docs/Web/API/WebRTC_API/WebRTC_basics

An example of opening a video stream using the Easy-API library https://plnkr.co/edit/4sVzu7?p=preview

 <!DOCTYPE html> <html> <head> <script src="//server1.easy-api.com/easy-api.js"></script> <style type="text/css"> div { width: 320px; height: 240px; } </style> </head> <body> <div id='media'></div> <div id='player'></div> <script type='text/javascript'> Easy.init({siteId: 'W4400388548'},function(response) { Easy.media('media',{level:0}).flow().start(function(response){ Easy.player('player').play(response.streamId); }); }); </script> </body> </html>