WebRTC PeerJS Текстовый чат - Подключение к нескольким peerID одновременно

Question

Привет друзья Я работаю на подключение к многократным пэра идентификатор для текстового чата, когда я подключиться к только одного партнера он работает

, но я получаю задача о подключении нескольких peerid одновременно

Например для подключения одного партнера мы будем использовать этот

var conn = peer.connect(peerId); 

    conn.on('open', function() { 
     connect(conn); 
    }); 

Когда я хочу подключиться к нескольким пэра ID

напр: вар peerIDs = [ 'peerid 1', 'peerid 2', 'peerid 3']

Я использую петлю для этого

for(var i=0 ; i < peerIDs.length ; i++){ 
    conn = peer.connect(peerIDs[i]); 

    conn.on('open', function() { 
     connect(conn); 
    });   
} 

Вот полный код:

var userId = new Date().getTime(); 
//Get the ID from the server 
var peer = new Peer(userId, {host: 'localhost', port: 3031, path: '/',debug: true }); 

var conn; 
var connections = []; 

//to receive id from the server 
peer.on('open', function(id){ 
    console.log('the id is' +id); 

}); 

//in case of error 
peer.on('error', function(e){ 
    alert(e.message); 
}) 

//Awaits for the connection 
peer.on('connection', connect); 

function connect(c){ 

    conn = c; 

    connections[c.peer].on('data', function(data){ 

     var mess = document.createElement('div'); 
     mess.innerHTML = '<span class="peer">' + c.peer + '</span>: ' + data; 
     angular.element(document.querySelector('.messages')).append(mess); 


    }); 

    connections[c.peer].on('close', function(){ 

     alert(c.peer + 'has left the chat'); 

    }); 



} 

//When user clicks the chat button 
$scope.chat = function(){ 
    alert('user clicked the connect button'); 

    var peerIDs = [ 'peerid 1', 'peerid 2', 'peerid 3'] 
    for(var i=0 ; i < peerIDs.length ; i++){ 
     var conn = peer.connect(peerIDs[i]); 

     conn.on('open', function() { 
      connections.push(c); 
      connect(conn); 
     });   
    } 


} 

//send message when clicked 
$scope.send = function(){ 

    // For each active connection, send the message. 
    var msg = angular.element(document.querySelector('#mess')).val(); 

    //Send message to all connected peers 
    for(var i in connections){ 
     connections[i].send(msg); 
    } 

    angular.element(document.querySelector('.messages')).append('<div><span class="you">You: </span>' + msg 
      + '</div>'); 

} 

Не могли бы вы дать представление о том, как достичь этого. Ваша помощь будет очень оценена.

Answer 1

Чтобы иметь возможность одновременного подключения к нескольким соединениям, вам необходимо одновременно обрабатывать мультисоединения.

// Array of remote peers ID and data channel 
var remotePeerIds=[],// You need this to link with specific DOM element 
connections=[]; // This is where you manage multi-connections 

// create a Peer 
var peer = new Peer({key: 'YOUR_KEY'}); // You can use your own peerID here 

// Get your local peer id 
peer.on('open', function(id) { 
    console.log('My peer ID is: ' + id); 
}); 

// Start connection with other peer - and handle it 
getConnect(remotePeerId){ 
    var conn = peer.connect(remotePeerId); 
    handleConnection(conn); 
} 

// Ok now you need to handle the received connection too 
peer.on('connection',function(conn){ 
    handleConnection(conn); 
}); 

// Handle connection - this is most important part 
handleConnection(conn){ 
    remotePeerIds.push(conn.peer); // Add remote peer to list 

    conn.on('open', function() { 
     console.log("Connected with peer: "+remotePeerId); 
     conn.on('data',function(data){ 
      // You can do whatever you want with the data from this connection - this is also the main part 
      dataHandler(conn,data); 
     }); 
     conn.on('error',function(){ 
      // handle error 
      connectionError(conn); 
     }); 

     conn.on('close',function(){ 
      // Handle connection closed 
      connectionClose(conn); 
     }); 
     connections.push(conn); 
    }); 
    }); 
} 

// So now you have multi-connections. If you want to send a message to all other peer, just using for loop with all the connections 
function broadcastMessage(message){ 
    for(var i=0;i<connections.length,i++){ 
     connections[i].send(message); 
    } 
} 

// Or if you want to send a message to a specific peer - you need to know his peerid 

function privateMessage(remotePeerId,message){ 
    for(var i=0;i<connections.length,i++){ 
     if(connections[i].peer==remotePeerId){ 
      connections[i].send(message); 
      break; 
     } 
    } 
} 

Это основная часть, вам необходимо добавить еще один код для обработчика соединения в случае ошибки и закрытия.

Вот и все!

Answer 2

@ luongnv89 Спасибо за ваш ответ.

Но я получаю проблема, когда я пытаюсь соединить несколько peerID

Для Ex:

// Start connection with other peer - and handle it 
    function getConnect(remotePeerId){ 
     var conn = peer.connect(remotePeerId); 
     handleConnection(conn); 
    } 

    var peerIDS = ['cttgmy43jy30udi0', 'mhzqhpn8rj4f5hfr']; 

    for(var i=0 ; i < peerIDS.length ; i++){ 
     getConnect(peerIDS[i]);  
    } 

Когда я побежал выше петлю я могу, способный соединить только с последним peerid, который я пройти в массив в данном случае это «mhzqhpn8rj4f5hfr»

Здесь я отправляю на консоль вещь

PeerJS: Creating RTCPeerConnection. 
peer.min.js:1 PeerJS: Listening for ICE candidates. 
peer.min.js:1 PeerJS: Listening for `negotiationneeded` 
peer.min.js:1 PeerJS: Listening for data channel 
peer.min.js:1 PeerJS: Listening for remote stream 
peer.min.js:1 PeerJS: Creating RTCPeerConnection. 
peer.min.js:1 PeerJS: Listening for ICE candidates. 
peer.min.js:1 PeerJS: Listening for `negotiationneeded` 
peer.min.js:1 PeerJS: Listening for data channel 
peer.min.js:1 PeerJS: Listening for remote stream 
2peer.min.js:1 PeerJS: `negotiationneeded` triggered 
peer.min.js:1 PeerJS: Created offer. 
peer.min.js:1 PeerJS: Set localDescription: offer for: cttgmy43jy30udi0 
peer.min.js:1 PeerJS: Created offer. 
peer.min.js:1 PeerJS: Received ICE candidates for: cttgmy43jy30udi0 
peer.min.js:1 PeerJS: Set localDescription: offer for: mhzqhpn8rj4f5hfr 
peer.min.js:1 PeerJS: Received ICE candidates for: mhzqhpn8rj4f5hfr 
peer.min.js:1 PeerJS: Setting remote description RTCSessionDescription {sdp: "v=0 
↵o=- 8190108536299128797 2 IN IP4 127.0.0.1 
↵s…id:data 
↵a=sctpmap:5000 webrtc-datachannel 1024 
↵", type: "answer"} 
peer.min.js:1 PeerJS: Added ICE candidate for: cttgmy43jy30udi0 
peer.min.js:1 PeerJS: Set remoteDescription: ANSWER for: cttgmy43jy30udi0 
2peer.min.js:1 PeerJS: Added ICE candidate for: cttgmy43jy30udi0 
2peer.min.js:1 PeerJS: Received ICE candidates for: mhzqhpn8rj4f5hfr 
peer.min.js:1 PeerJS: Data channel connection success 
peer.min.js:1 PeerJS: Setting remote description RTCSessionDescription {sdp: "v=0 
↵o=Mozilla-SIPUA-35.0.1 15417 0 IN IP4 0.0.0.0…ap:5000 webrtc-datachannel 1024 
↵a=setup:active 
↵", type: "answer"} 
2peer.min.js:1 PeerJS: Added ICE candidate for: mhzqhpn8rj4f5hfr 
peer.min.js:1 PeerJS: Set remoteDescription: ANSWER for: mhzqhpn8rj4f5hfr 
peer.min.js:1 PeerJS: Added ICE candidate for: mhzqhpn8rj4f5hfr 
peer.min.js:1 PeerJS: Data channel connection success 
peer.min.js:1 PeerJS: Added ICE candidate for: mhzqhpn8rj4f5hfr 

Так что же это, чтобы сделать его работу я не знаю, является ли это правильный подход или нет ...

Я просто установить задержку между соединениями

var peerIDS = ['cttgmy43jy30udi0', 'mhzqhpn8rj4f5hfr']; 
var arrLength = peerIDS.length; 
var count  = 0; 

(function processConnection(){ 

    if(arrLength <= count) return; 

    getConnect(peerIDS[count]); 
    count++; 
    setTimeout(function(){ 
     processConnection() 
    }, 5000); 
})(); 

И теперь он работает правильно .. Не могли бы вы рассказать мне, идет ли я по правильному пути или есть ли еще лучший способ сделать это?