javascript - 无法发送到特定房间和客户端(Socket.io 2.0.2)

Question

我正在使用 Socket.io 创建多人游戏。我使用生成的数字代码来动态创建和加入房间。

我的问题是向特定房间甚至特定客户发出信号。我无法发送到房间(io.in(room).emit('event') 或 io.to(room).emit('event') 它们是同义词)。不过，我可以在服务器和客户端之间socket.emit('event') 正常工作。没有错误。当我使用除了 socket.emit()、io.emit() 和 socket.on('',function(){ this 之外的任何东西时，什么也不会发生.emit(); }).

我必须发送到特定房间的原因是当新客户加入时更新其房间中的所有客户。 (我曾尝试向每个房间中的每个 socket.id 发送信息，但这不起作用)。

browser debugger tracking server emitted events

我已经上传了我在 Node.js 服务器中使用的所有代码，希望有人可以看到我程序中的错误。我是 Socket.io 的新手，我不确定我设置动态房间的有效性。

不起作用的房间事件是:connectToRoom

服务器

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

 app.get('/',function(req, res) {
     res.sendFile(__dirname + '/client/index.html');
 });
 app.use('/client',express.static(__dirname + '/client'));
 http.listen(3000, function(){
     console.log('listening on localhost:3000');
 });

io.on('connection', function(socket){
    socket.id = Math.random();
    SOCKET_LIST[socket.id]=socket;

    socket.on('create',function(){
        var thisGameId = ( Math.random() * 100000 ) | 0;
        roomNo+=1;
        roomArr[thisGameId]=thisGameId;
        this.emit('createResponse', {gameId: thisGameId, mySocketId: socket.id});
        this.join(thisGameId.toString());
    });

    socket.on('joinRoom',function(data){
        //playerJoinGame(data);
        //io.sockets.in(data.roomKey.toString()).emit('connectToRoom', "You are in room no. "+data.roomKey);
        //socket.to(data.roomKey.toString()).emit('connectToRoom', "You are in room no. "+data.roomKey);
        if( io.nsps['/'].adapter.rooms[data.roomKey]!== undefined ){
            socket.join(data.roomKey.toString());
            SOCKET_LIST[socket.id].username = data.username;
            this.emit('joinRoomResponse',{
                roomKey:data.roomKey
            });
        }
        if(io.nsps['/'].adapter.rooms[data.roomKey]=== undefined){
            this.emit('joinError',{
                message: "This room does not exist."
            });
        }
    });
    socket.on('updateRoom',function(data){
        var clients=io.sockets.adapter.rooms[data.roomKey].sockets;
        var clientsArr=Object.keys(clients);
        for (var clientId in clientsArr ) {
            io.sockets.connected[clientsArr[clientId]].emit('connectToRoom', {
                roomKey:data.roomKey,
                username:data.username
            });
        }

        io.sockets.in(data.roomKey).emit('connectToRoom', {
            roomKey:data.roomKey,
            username:data.username
        });
    });

    socket.on('disconnect',function(){
    delete SOCKET_LIST[socket.id];
    });
});

客户端

var socket = io();
var roomKey,username,mySocketId;    
var optionDiv = document.getElementById('optionDiv');
var optionDivCreate = document.getElementById('optionDiv-create');
var optionDivJoin = document.getElementById('optionDiv-join');

var prepDiv = document.getElementById('prepDiv');
var createDiv = document.getElementById('create-Div');
var lobbyDiv = document.getElementById('lobbyDiv');
var createRoomKey = document.getElementById('create-roomKey');
var createPlayers = document.getElementById('create-players');
var joinForm = document.getElementById('join-form');
var joinForm_roomKey = document.getElementById('join-roomKey');
var joinForm_username = document.getElementById('join-username');
var joinForm_submit = document.getElementById('join-form-submit');
var gameDiv = document.getElementById("gameDiv");

optionDivCreate.onclick=function(){
    socket.emit('create');
};
optionDivJoin.onclick=function(){
    optionDiv.style.display='none';
    prepDiv.style.display='inline-block';
    joinForm.style.display='inline-block';
};
socket.on('createResponse',function(data){
    roomKey = data.gameId;
    mySocketId = data.mySocketId;
    optionDiv.style.display='none';
    prepDiv.style.display='inline-block';
    createDiv.style.display='inline-block';
    createRoomKey.innerHTML = roomKey;
});

joinForm_submit.onclick= function(){

};
joinForm.onsubmit = function(e){
    e.preventDefault();
    roomKey = joinForm_roomKey.value;
    username = joinForm_username.value;
    socket.emit('joinRoom',{
        roomKey:roomKey,
        username:username
    });
    joinForm_roomKey.value='';
    joinForm_username.value='';
};
socket.on('joinRoomResponse',function(data){
    optionDiv.style.display='none';
    createDiv.style.display='none';
    prepDiv.style.display='none';
    lobbyDiv.style.display='inline-block';
    socket.emit('updateRoom',{
        roomKey:roomKey,
        username:username
    });
});
socket.on('connectToRoom',function(data){
    socket.emit('debug');
    //createPlayers.innerHTML = "<br />"+data.username;
    alert("triggered");
});
socket.on('joinError',function(data){
    alert(data.message);
});

HTML

<!DOCTYPE html>
<!--
To change this license header, choose License Headers in Project Properties.
To change this template file, choose Tools | Templates
and open the template in the editor.
-->
<html>
    <head>
        <title>Prototype</title>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
    </head>
    <body>
        <div id="optionDiv" style="">
            <button id="optionDiv-create">Create Game</button><br />
            <button id="optionDiv-join">Join Game</button>
        </div>
        <div id="prepDiv" style="display:none;">
            <div id="create-Div" style="display:none;">
                Room Key:<br />
                <h1 id="create-roomKey"></h1>
                <h1 id="create-players"></h1>
            </div>
            <form id="join-form" style="display:none;">
                Username:<br />
                <input id="join-username" type="text" style="width:500px"></input><br />
                Room Key:<br />
                <input id="join-roomKey" type="text" style="width:500px"></input><br />
                <button id="join-form-submit">Join</button>
            </form>
        </div>
        <div id="lobbyDiv" style="display:none;">
            You are in room:<br />
            <h1 id="join-roomKey"></h1><br />
            Players in room:<br />
            <h1 id="join-players"></h1>
        </div>
        <div id="gameDiv" style="display:none;">
            <div id="gameDiv-canvas">
                <canvas id="ctx" width="500" height="500" style="border:1px solid #000000;">
                </canvas>
            </div>
            <div id="gameDiv-chat">
                <div id="chat-text" style="width:500px;height:100px;overflow-y:scroll">
                    <div>
                        Hello!
                    </div>
                </div>
                <form id="chat-form">
                    <input id="chat-input" type="text" style="width:500px"></input>
                </form>
            </div>
        </div>
        <!--<script src="https://cdn.socket.io/socket.io-1.4.5.js"></script>
        <script src="https://cdnjs.cloudflare.com/ajax/libs/socket.io/2.0.2/socket.io.js"></script>-->
        <script src="/socket.io/socket.io.js"></script>
        <script src="/client/js/client.js"></script>
    </body>
</html>

Answer 1

正确的语法如下:

io.to('some room').emit('some event');