WebRTC는 로컬 서버에서 잘 작동하지만 VPS에 배포하면 localVideo 만 볼 수 있습니다. romoteVideo는 검은 색 squre입니다.

Question

WebRTC는 로컬 서버에서 잘 작동하지만 VPS에 배포 할 때만 가능합니다. localVideo를 보면, romoteVideo는 검은 색 화면입니다.

내 한 WebRTC 코드는 다음과 같습니다

var socket = io.connect(); 

var remotevid = document.getElementById('webrtc-remotevid'); 
var localStream = null; 
var peerConn = null; 
var started = false; 
var channelReady = false; 
var mediaConstraints = {'mandatory': { 
         'OfferToReceiveAudio':true, 
         'OfferToReceiveVideo':true }}; 
var isVideoMuted = true; 

var videoCamera = new tracking.VideoCamera().hide().render().renderVideoCanvas(); 

function setLocalAndSendMessage(sessionDescription) { 
    peerConn.setLocalDescription(sessionDescription); 
    console.log("Sending: SDP"); 
    console.log(sessionDescription); 
    socket.json.send(sessionDescription); 
} 

function createOfferFailed() { 
    console.log("Create Answer failed"); 
} 

// start the connection upon user request 
    function connectvid() { 

    console.log(localStream); 
    if (!started && localStream && channelReady) { 
     createPeerConnection(); 
     started = true; 
     peerConn.createOffer(setLocalAndSendMessage, createOfferFailed, mediaConstraints); 
    } else { 
     alert("Local stream not running yet - try again."); 
    } 

} 

// stop the connection upon user request 
function hangUp() { 
    console.log("Hang up.");  
    socket.json.send({type: "bye"}); 
    stop(); 
} 

function stop() { 
    peerConn.close(); 
    peerConn = null; 
    started = false;  
} 

// socket: channel connected 
socket.on('connect', onChannelOpened) 
     .on('message', onMessage); 

function onChannelOpened(evt) { 
    console.log('Channel opened.'); 
    channelReady = true; 
} 

function createAnswerFailed() { 
    console.log("Create Answer failed"); 
} 
// socket: accept connection request 
function onMessage(evt) { 
    if (evt.type === 'offer') { 
    console.log("Received offer...") 
    if (!started) { 
     createPeerConnection(); 
     started = true; 
    } 
    console.log('Creating remote session description...'); 
    peerConn.setRemoteDescription(new RTCSessionDescription(evt)); 
    console.log('Sending answer...'); 
    peerConn.createAnswer(setLocalAndSendMessage, createAnswerFailed, mediaConstraints); 

    } else if (evt.type === 'answer' && started) { 
    console.log('Received answer...'); 
    console.log('Setting remote session description...'); 
    peerConn.setRemoteDescription(new RTCSessionDescription(evt)); 

    } else if (evt.type === 'candidate' && started) { 
    console.log('Received ICE candidate...'); 
    var candidate = new RTCIceCandidate({sdpMLineIndex:evt.sdpMLineIndex, sdpMid:evt.sdpMid, candidate:evt.candidate}); 
    console.log(candidate); 
    peerConn.addIceCandidate(candidate); 

    } else if (evt.type === 'bye' && started) { 
    console.log("Received bye"); 
    stop(); 
    } 
} 

function createPeerConnection() { 
    console.log("Creating peer connection"); 
    RTCPeerConnection = webkitRTCPeerConnection || mozRTCPeerConnection; 
    var pc_config = {"iceServers":[]}; 
    try { 
    peerConn = new RTCPeerConnection(pc_config); 

    } catch (e) { 
    console.log("Failed to create PeerConnection, exception: " + e.message); 
    } 
    // send any ice candidates to the other peer 
    peerConn.onicecandidate = function (evt) { 
    if (event.candidate) { 
     console.log('Sending ICE candidate...'); 
     console.log(evt.candidate); 
     socket.json.send({type: "candidate", 
         sdpMLineIndex: evt.candidate.sdpMLineIndex, 
         sdpMid: evt.candidate.sdpMid, 
         candidate: evt.candidate.candidate}); 
    } else { 
     console.log("End of candidates."); 
    } 
    }; 
    console.log('Adding local stream...'); 
    console.log(localStream); 
    peerConn.addStream(localStream); 

    // peerConn.addStream(localScreen); 

    peerConn.addEventListener("addstream", onRemoteStreamAdded, false); 

    // when remote adds a stream, hand it on to the local video element 
    function onRemoteStreamAdded(event) { 
    console.log("Added remote stream"); 
    remotevid.src = window.URL.createObjectURL(event.stream); 
    } 

    // when remote removes a stream, remove it from the local video element 
} 

socket.on('disconnect', function() { 
    remotevid.src = ""; 
    started = false; 
}) 

는 내가 뭐가 잘못 됐는지 아무 생각이 없다, 그것은 크롬 플래그와 함께 문제가 있나요?

Answer 1

로컬 네트워크에서만 시도했을 수도 있기 때문에 로컬로 작동합니다. 그것이 공개 될 때, ip 차이점, 프록시는 모두 그림으로옵니다. 먼저 기절 서버를 설정해야합니다. 몇 가지 공개 기절 서버를 사용할 수 있습니다.

하나의 예를 들어 당신이 문제에 직면하는 경우, 당신은 점점 정확한 오류를 확인 stun.l.google.com:19302

아직도있다.