WSL Ubuntu에서 WebRTC 서버에 Coturn을 적용하는 방법에 관한 질문

Question

안녕하세요webRTC로 비디오/오디오 스트리밍이 되는 서버를 만들어보려고 합니다.예제파일을 받아서 node.js로 만지다보니 화상통화 하듯 서로의 화면이 보이긴 하지만네트워크가 달라지면 서로 화면이 보이지가 않더라구요.그래서 찾아보니 WSL에 Ubuntu를 설치하고 Coturn을 적용해서 중계를 시키면외부 접속이 가능하다는 글을 보고 (https://forest71.tistory.com/?page=3) 따라 해봤습니다.그런데 결과는 그대로.. 네트워크가 다르면 되지를 않습니다.이게 참.. 어디가 잘못된 건지 감도 안오고 난감합니다.보여드려야 할 것들이 많아 길이가 길테지만시간이 있으시다면, 꼭 한번 봐주시고 조언 좀 부탁드립니다.index.html Realtime communication with WebRTC

Realtime communication with WebRTC

index.js'use strict'; var os = require('os'); var nodeStatic = require('node-static'); const https = require('https'); const fs = require('fs'); const options = { key: fs.readFileSync('./private.pem'), cert: fs.readFileSync('./public.pem') }; var socketIO = require('socket.io'); var fileServer = new(nodeStatic.Server)(); let app = https.createServer(options, (req,res)=>{ fileServer.serve(req, res); }).listen(3000); console.log('Started chating server...'); var io = socketIO.listen(app); io.sockets.on('connection', function(socket) { // convenience function to log server messages on the client function log() { var array = ['Message from server:']; array.push.apply(array, arguments); socket.emit('log', array); } socket.on('message', function(message) { log('Client said: ', message); if (message==="bye" && socket.rooms['foo']) { io.of('/').in('foo').clients((error, socketIds) => { if (error) throw error; socketIds.forEach(socketId => { io.sockets.sockets[socketId].leave('foo'); }); }); } socket.broadcast.emit('message', message); }); socket.on('create or join', function(room) { log('Received request to create or join room ' + room); var clientsInRoom = io.sockets.adapter.rooms[room]; var numClients = clientsInRoom ? Object.keys(clientsInRoom.sockets).length : 0; log('Room ' + room + ' now has ' + numClients + ' client(s)'); if (numClients === 0) { socket.join(room); log('Client ID ' + socket.id + ' created room ' + room); socket.emit('created', room, socket.id); console.log('created'); } else if (numClients === 1) { log('Client ID ' + socket.id + ' joined room ' + room); io.sockets.in(room).emit('join', room); socket.join(room); socket.emit('joined', room, socket.id); io.sockets.in(room).emit('ready'); console.log('joined'); } else { // max two clients socket.emit('full', room); } }); socket.on('ipaddr', function() { var ifaces = os.networkInterfaces(); for (var dev in ifaces) { ifaces[dev].forEach(function(details) { if (details.family === 'IPv4' && details.address !== '127.0.0.1') { socket.emit('ipaddr', details.address); } }); } }); socket.on('bye', function(){ console.log('received bye'); }); }); main.js'use strict'; var isChannelReady = false; var isInitiator = false; var isStarted = false; var localStream; var pc; var remoteStream; var turnReady; var pcConfig = { 'iceServers': [ {"urls":["turn:공인IP주소는지웠습니다:3478?transport=tcp"],"username":"test","credential":"test"} ] }; // Set up audio and video regardless of what devices are present. var sdpConstraints = { offerToReceiveAudio: true, offerToReceiveVideo: true }; ///////////////////////////////////////////// var room = 'foo'; // Could prompt for room name: // room = prompt('Enter room name:'); var socket = io.connect(); if (room !== '') { socket.emit('create or join', room); console.log('Attempted to create or join room', room); } socket.on('created', function(room) { console.log('Created room ' + room); isInitiator = true; }); socket.on('full', function(room) { console.log('Room ' + room + ' is full'); }); socket.on('join', function (room){ console.log('Another peer made a request to join room ' + room); console.log('This peer is the initiator of room ' + room + '!'); isChannelReady = true; }); socket.on('joined', function(room) { console.log('joined: ' + room); isChannelReady = true; }); socket.on('log', function(array) { console.log.apply(console, array); }); //////////////////////////////////////////////// function sendMessage(message) { console.log('Client sending message: ', message); socket.emit('message', message); } // This client receives a message socket.on('message', function(message) { console.log('Client received message:', message); if (message === 'got user media') { maybeStart(); } else if (message.type === 'offer') { if (!isInitiator && !isStarted) { maybeStart(); } pc.setRemoteDescription(new RTCSessionDescription(message)); doAnswer(); } else if (message.type === 'answer' && isStarted) { pc.setRemoteDescription(new RTCSessionDescription(message)); } else if (message.type === 'candidate' && isStarted) { var candidate = new RTCIceCandidate({ sdpMLineIndex: message.label, candidate: message.candidate }); pc.addIceCandidate(candidate); } else if (message === 'bye' && isStarted) { handleRemoteHangup(); } }); //////////////////////////////////////////////////// var localVideo = document.querySelector('#localVideo'); var remoteVideo = document.querySelector('#remoteVideo'); navigator.mediaDevices.getUserMedia({ audio: true, video: true }) .then(gotStream) .catch(function(e) { alert('getUserMedia() error: ' + e.name); }); function gotStream(stream) { console.log('Adding local stream.'); localStream = stream; localVideo.srcObject = stream; sendMessage('got user media'); if (isInitiator) { maybeStart(); } } var constraints = { video: true }; console.log('Getting user media with constraints', constraints); if (location.hostname !== 'localhost') { requestTurn( 'https://공인ip는지웠습니다:3000/turn?username=41784574&key=4080218913' ); } function maybeStart() { console.log('>>>>>>> maybeStart() ', isStarted, localStream, isChannelReady); if (!isStarted && typeof localStream !== 'undefined' && isChannelReady) { console.log('>>>>>> creating peer connection'); createPeerConnection(); pc.addStream(localStream); isStarted = true; console.log('isInitiator', isInitiator); if (isInitiator) { doCall(); } } } window.onbeforeunload = function() { sendMessage('bye'); }; ///////////////////////////////////////////////////////// function createPeerConnection() { try { pc = new RTCPeerConnection(pcConfig); pc.onicecandidate = handleIceCandidate; pc.onaddstream = handleRemoteStreamAdded; pc.onremovestream = handleRemoteStreamRemoved; console.log('Created RTCPeerConnnection'); } catch (e) { console.log('Failed to create PeerConnection, exception: ' + e.message); alert('Cannot create RTCPeerConnection object.'); return; } } function handleIceCandidate(event) { console.log('icecandidate event: ', event); if (event.candidate) { sendMessage({ type: 'candidate', label: event.candidate.sdpMLineIndex, id: event.candidate.sdpMid, candidate: event.candidate.candidate }); } else { console.log('End of candidates.'); } } function handleCreateOfferError(event) { console.log('createOffer() error: ', event); } function doCall() { console.log('Sending offer to peer'); pc.createOffer(setLocalAndSendMessage, handleCreateOfferError); } function doAnswer() { console.log('Sending answer to peer.'); pc.createAnswer().then( setLocalAndSendMessage, onCreateSessionDescriptionError ); } function setLocalAndSendMessage(sessionDescription) { pc.setLocalDescription(sessionDescription); console.log('setLocalAndSendMessage sending message', sessionDescription); sendMessage(sessionDescription); } function onCreateSessionDescriptionError(error) { trace('Failed to create session description: ' + error.toString()); } function requestTurn(turnURL) { var turnExists = false; for (var i in pcConfig.iceServers) { if (pcConfig.iceServers[i].urls.substr(0, 5) === 'turn:') { turnExists = true; turnReady = true; break; } } if (!turnExists) { console.log('Getting TURN server from ', turnURL); // No TURN server. Get one from computeengineondemand.appspot.com: var xhr = new XMLHttpRequest(); xhr.onreadystatechange = function() { if (xhr.readyState === 4 && xhr.status === 200) { var turnServer = JSON.parse(xhr.responseText); console.log('Got TURN server: ', turnServer); pcConfig.iceServers.push({ 'urls': 'turn:' + turnServer.username + '@' + turnServer.turn, 'credential': turnServer.password }); turnReady = true; } }; xhr.open('GET', turnURL, true); xhr.send(); } } function handleRemoteStreamAdded(event) { console.log('Remote stream added.'); remoteStream = event.stream; remoteVideo.srcObject = remoteStream; remoteVideo.classList.add("remoteVideoInChatting"); localVideo.classList.add("localVideoInChatting"); } function handleRemoteStreamRemoved(event) { console.log('Remote stream removed. Event: ', event); } function hangup() { console.log('Hanging up.'); stop(); sendMessage('bye'); } function handleRemoteHangup() { remoteVideo.classList.remove("remoteVideoInChatting"); localVideo.classList.remove("localVideoInChatting"); console.log('Session terminated.'); stop(); isInitiator = false; } function stop() { isStarted = false; pc.close(); pc = null; } 포트포워드방화벽은 5349, 3478, 3000 포트에 대해 인바운드, 아웃바운드 허용 되어 있는 상태입니다.이어서 WSL입니다.sudo service coturn statussudo vim /etc/turnserver.conf이후 turnadmin 을 통해 turnserver를 사용할 수 있는 계정을 생성해야 한다고 해서 진행한 명령문입니다.:~$ turnadmin -a -u test -p test -r testnameTrickle ICE에서 돌려본 결과입니다. 내부 네트워크끼리 통신을 할때 화면과 CMD 창입니다.서로 다른 네트워크 (서버가 켜진 PC & 스마트폰 LTE)이런식으로 누군가 들어왔다는듯이 자기화면이 작아지는데 화면이 보이지는 않습니다.이유를 아시는 능력자 분이 계신다면 도와주세요

WSL Ubuntu에서 WebRTC 서버에 Coturn을 적용하는 방법에 관한 질문

0개의 답변

Q&A 목록