Socket.io zufälliger Chatroom

Question

Ich versuche, eine App (Omegle wie) zu erstellen, wo Menschen sich einloggen und mit zufälligen Personen sprechen können.
Fall: Wenn sich zwei Personen (Clients) anmelden, dann console.log (Raum); innerhalb des Clients (Chat-Start-Ereignis) druckt den Raum.Aber wenn ein dritter Client anmeldet, anstatt zu warten, erstellt er einen neuen Raum und verbindet sich mit einem der beiden anderen, um einen neuen Raum zu schaffen Funktion findPeerForLoneSocket (Socket);

Server-Seite:

// Socket.io Setup 
var io = socket(server); 
var allUsers = {}; 
var rooms = {}; 
var queue = []; 
var names =[]; 

app.get('/chat2',function(req,res){ 
    if (req.isAuthenticated()) { 
    res.render('chat'); 
    var findPeerForLoneSocket = function(socket) { 
     if (queue.length > 0) { 
      var peer= queue.pop(); 
      var room = socket.id + '#' + peer.id; 
      peer.join(room); 
      socket.join(room); 
      rooms[peer.id] = room; 
      rooms[socket.id] = room; 
      peer.emit('chat start', {'name': names[socket.id], 'room':room}); 
      socket.emit('chat start', {'name': names[peer.id], 'room':room}); 
     } else { 
      queue.push(socket); 
     } 
    } 

    io.on('connection', function(socket) {  
     findPeerForLoneSocket(socket); 
    }); 

} else { 
    res.redirect('/'); 
    } 
}) 

Kunde:

$(document).ready(function(){ 
    var socket = io('http://localhost:3000'); 
    var connected = false; 
var message = document.getElementById('message'), 


handle = document.getElementById('handle'), 
    btn = document.getElementById('send'), 
    btn2 = document.getElementById('next'), 
    output = document.getElementById('output'); 

    socket.on('connect', function (data) { 
    connected = true; 
    }); 

    socket.on('chat start', function(data) { 
    $("#connecting").remove(); 
    $("#connected").text('Connected...'); 
     room = data.room; 
     console.log(room); 
    }); 
}); 

Answer 1

Wenn ein Client eine Verbindung zu /chat2 passieren zwei Dinge:
1. wir machen eine chat Datei,
2. wir schaffen ein neuer Hörer auf 'connecting' Ereignis.

Jedes Mal, wenn ein neuer Client eine Verbindung herstellt, wird der neue Listener erstellt. Wenn zwei Clients bereits verbunden sind und erfolgreich in ein Zimmer verschoben wurden, haben wir bereits zwei Listener io.on('connection') warten. Wenn ein dritter Client eine Verbindung herstellt, schiebt ihn der erste Listener in das Warteschlangen-Array und der zweite Listener öffnet ihn und erstellt einen neuen Raum für ihn und für seinen Peer. Sowohl socket.id als auch peer.id sind identisch, so dass der dritte Client mit sich selbst chattet. Und wenn die vierten Kunden bereits gibt es drei Zuhörer verbinden ...

Sie haben wie im Beispiel unten io.on('connecting') aus app.get Code nehmen (mehrere console.logs hinzugefügt für das Debuggen).

const express = require('express'); 
const app = express(); 
const http = require('http').Server(app); 
const io = require('socket.io')(http); 

var queue = []; 

var findPeerForLoneSocket = function(socket) { 
    if (queue.length > 0) { 
     var peer= queue.pop(); 
     console.log(peer.id + ' was popped from queue\n'); 
     log(queue); 
     var room = socket.id + '#' + peer.id; 
     peer.join(room); 
     socket.join(room); 
     console.log(socket.id + ' and ' + peer.id + ' joined room ' + room); 
     peer.emit('chat start', {'name': socket.id, 'room':room}); 
     socket.emit('chat start', {'name': peer.id, 'room':room}); 
    } else { 
     queue.push(socket); 
     console.log(socket.id + ' was pushed to queue\n'); 
     log(queue); 
    } 
}; 

var log = arr => { 
    console.log('Queue: '); 
    for (let i = arr.length; i--;) { 
     console.log(arr[i].id); 
    } 
    console.log('\n'); 
}; 

io.on('connection', function (socket) { 
    console.log(socket.id + ' connected'); 
    findPeerForLoneSocket(socket); 
}); 

http.listen(3000, function(){ 
    console.log('express + socket.io server listening on *:3000'); 
}); 

app.get('/', (req,res) => { 
    res.sendFile(__dirname + '/sterg.html'); 
});