var rooms = ['Lobby'];
并且我想创建房间并将创建的房间名称推送到rooms[]
。我的目标是允许用户创建自己的房间并在可能的情况下删除它。我使用Michael Mukhin here的代码作为参考。
以下是我的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);
});
});
以下是客户端index.html中的代码
我想创建一个房间并将其添加到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>
请帮助我们,我已经阅读过socket.io文档。但我发现很难理解。我希望你能帮助我们。在此先感谢,对不起,我还在学习socket.io和node.js.感谢。
答案 0 :(得分:33)
这可能有所帮助:
server.js(没有关于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>