Node.js und Socket.io Raum erstellen

Question

kann ich um Ihre Hilfe bitten. Meine Codes funktionieren nicht zum Erstellen eines Raums mit socket.room, zuerst habe ich var rooms = ['Lobby']; deklariert und ich möchte Räume erstellen und die erstellten Raumnamen auf rooms[] schieben. Mein Ziel ist es, Benutzern zu ermöglichen, ihr eigenes Zimmer zu erstellen und es wenn möglich zu löschen. Ich habe den Code von Michael Mukhin here als Referenz verwendet. Hier

ist der Code meiner server.js

var redis = require('redis'); 
var express = require('express'); 
var app = express(); 
var http = require('http'); 
var server = http.createServer(app); 
var io = require('socket.io').listen(server); 
var publish = redis.createClient(); 
var subscribe = redis.createClient(); 

server.listen(8080); 


app.get('/', function (req, res) { 
    res.sendfile(__dirname + '/index.html'); 
}); 

var usernames = {}; 

var rooms = ['Lobby']; 

io.sockets.on('connection', function (socket) { 

    socket.on('adduser', function (username){ 
     socket.username = username; 
     socket.room = 'Lobby';   
     usernames[username] = username; 
     socket.join('Lobby');   
     subscribe.subscribe(socket.room); 
     socket.emit('updatechat', 'SERVER', 'you have connected to Lobby'); 
     socket.broadcast.to('Lobby').emit('updatechat', 'SERVER', username + ' has connected to this room'); 
     socket.emit('updaterooms', rooms, 'Lobby'); 
    }); 

    socket.on('create', function (room) { 
     var room = 'test'; 
     rooms.push(room); 
     }); 

    socket.on('sendchat', function (data) { 

     io.sockets.in(socket.room).emit('updatechat', socket.username, data); 
     if (socket.room === 'Lobby') { 
      publish.publish('Lobby', data); 
     } else { 
     publish.publish(socket.room, data); 
     } 
    }); 

    socket.on('switchRoom', function(newroom){ 
     socket.leave(socket.room); 
     socket.join(newroom); 
     subscribe.subscribe(newroom); 
     socket.emit('updatechat', 'SERVER', 'you have connected to '+ newroom); 
     socket.broadcast.to(socket.room).emit('updatechat', 'SERVER', socket.username+' has left this room'); 
     socket.room = newroom; 
     socket.broadcast.to(newroom).emit('updatechat', 'SERVER', socket.username+' has joined this room'); 
     socket.emit('updaterooms', rooms, newroom); 
    }); 



    socket.on('disconnect', function(){ 

     delete usernames[socket.username]; 
     io.sockets.emit('updateusers', usernames); 
     socket.broadcast.emit('updatechat', 'SERVER', socket.username + ' has disconnected'); 
     socket.leave(socket.room); 
    }); 
}); 

Hier ist der Code in der Client-index.html Ich möchte einen Raum schaffen, und fügen Sie sie in die Liste der rooms[] .

<script src="/socket.io/socket.io.js"></script> 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.min.js"></script> 
<script> 
    var socket = io.connect('http://localhost:8080'); 


    socket.on('connect', function(){ 

     socket.emit('adduser', prompt("What's your name: ")); 
     test(); 
    }); 


     //this is my create room to be called when i click a button 
     socket.on('createroom', function() { 
      socket.emit('create', room); 
     }); 




    socket.on('updatechat', function (username, data) { 
     $('#conversation').append('<b>'+ username + ':</b> ' + data + '<br>'); 
    }); 


    socket.on('updaterooms', function (rooms, current_room) { 
     $('#rooms').empty(); 
     $.each(rooms, function(key, value) { 
      if(value == current_room){ 
       $('#rooms').append('<div>' + value + '</div>'); 
      } 
      else { 
       $('#rooms').append('<div><a href="#" onclick="switchRoom(\''+value+'\')">' + value + '</a></div>'); 
      } 
     }); 
    }); 

    function switchRoom(room){ 
     socket.emit('switchRoom', room); 
    } 


    $(function(){ 
     $('#datasend').click(function() { 
      var message = $('#data').val(); 
      $('#data').val(''); 
      socket.emit('sendchat', message); 
     }); 


     $('#data').keypress(function(e) { 
      if(e.which == 13) { 
       $(this).blur(); 
       $('#datasend').focus().click(); 
      } 
     }); 
    }); 

</script> 
<div style="float:left;width:100px;border-right:1px solid black;height:300px;padding:10px;overflow:scroll-y;"> 
    <b>ROOMS</b> 
    <div id="rooms"></div> 
</div> 

<div style="float:left;width:300px;height:250px;overflow:scroll-y;padding:10px;"> 
    <div id="conversation"></div> 
    <input id="data" style="width:200px;" /> 
    <input type="button" id="datasend" value="send" /> 
</div> 

Bitte helfen Sie mir Jungs Ich habe bereits socket.io Dokumentation gelesen. Aber ich fand es schwer zu verstehen. Ich hoffe du kannst mir helfen Jungs. Vielen Dank im Voraus, es tut mir leid, aber ich lerne immer noch socket.io und node.js. Vielen Dank.

Answer 1

Dies kann helfen:

server.js (ohne den Code in Bezug auf redis)

var usernames = {}; 

var rooms = ['Lobby']; 

io.sockets.on('connection', function(socket) { 
    socket.on('adduser', function(username) { 
     socket.username = username; 
     socket.room = 'Lobby'; 
     usernames[username] = username; 
     socket.join('Lobby'); 
     socket.emit('updatechat', 'SERVER', 'you have connected to Lobby'); 
     socket.broadcast.to('Lobby').emit('updatechat', 'SERVER', username + ' has connected to this room'); 
     socket.emit('updaterooms', rooms, 'Lobby'); 
    }); 

    socket.on('create', function(room) { 
     rooms.push(room); 
     socket.emit('updaterooms', rooms, socket.room); 
    }); 

    socket.on('sendchat', function(data) { 
     io.sockets["in"](socket.room).emit('updatechat', socket.username, data); 
    }); 

    socket.on('switchRoom', function(newroom) { 
     var oldroom; 
     oldroom = socket.room; 
     socket.leave(socket.room); 
     socket.join(newroom); 
     socket.emit('updatechat', 'SERVER', 'you have connected to ' + newroom); 
     socket.broadcast.to(oldroom).emit('updatechat', 'SERVER', socket.username + ' has left this room'); 
     socket.room = newroom; 
     socket.broadcast.to(newroom).emit('updatechat', 'SERVER', socket.username + ' has joined this room'); 
     socket.emit('updaterooms', rooms, newroom); 
    }); 

    socket.on('disconnect', function() { 
     delete usernames[socket.username]; 
     io.sockets.emit('updateusers', usernames); 
     socket.broadcast.emit('updatechat', 'SERVER', socket.username + ' has disconnected'); 
     socket.leave(socket.room); 
    }); 
}); 

index.html

<head> 
... // your other code 
<script> 
var socket = io.connect('http://localhost:8000'); 

socket.on('connect', function(){ 
    socket.emit('adduser', prompt("What's your name: ")); 
}); 

socket.on('updatechat', function (username, data) { 
    $('#conversation').append('<b>'+ username + ':</b> ' + data + '<br>'); 
}); 


socket.on('updaterooms', function (rooms, current_room) { 
    $('#rooms').empty(); 
    $.each(rooms, function(key, value) { 
     if(value == current_room){ 
      $('#rooms').append('<div>' + value + '</div>'); 
     } 
     else { 
      $('#rooms').append('<div><a href="#" onclick="switchRoom(\''+value+'\')">' + value + '</a></div>'); 
     } 
    }); 
}); 

function switchRoom(room){ 
    socket.emit('switchRoom', room); 
} 

$(function(){ 
    $('#datasend').click(function() { 
     var message = $('#data').val(); 
     $('#data').val(''); 
     socket.emit('sendchat', message); 
    }); 

    $('#data').keypress(function(e) { 
     if(e.which == 13) { 
      $(this).blur(); 
      $('#datasend').focus().click(); 
     } 
    }); 

    $('#roombutton').click(function(){ 
     var name = $('#roomname').val(); 
     $('#roomname').val(''); 
     socket.emit('create', name) 
    }); 
}); 

</script> 
</head> 
<body> 
    <div style="float:left;width:100px;border-right:1px solid black;height:300px;padding:10px;overflow:scroll-y;"> 
     <b>ROOMS</b> 
     <div id="rooms"></div> 
    </div> 

    <div style="float:left;width:300px;height:250px;overflow:scroll-y;padding:10px;"> 
     <div id="conversation"></div> 
     <input id="data" style="width:200px;" /> 
     <input type="button" id="datasend" value="send" /> 
    </div> 

    <div style="float:left;width:300px;height:250px;overflow:scroll-y;padding:10px;"> 
     <div id="room creation"></div> 
     <input id="roomname" style="width:200px;" /> 
     <input type="button" id="roombutton" value="create room" /> 
    </div> 
    ... // the rest of your page 
</body>