Question

我正在开发一个应用程序，它有两个功能，连接空间和创建空间。当用户创建房间时，将生成随机散列码（例如，123），其将附加到URL并在socket.io中创建具有名为（例如，123）的散列码的房间。到目前为止这是成功的。但是，我无法在同一个房间内广播更新的客户端数量。用户可以使用提供的哈希码（创建房间时生成）单击并加入房间。当第二个用户加入房间时，我想更新房间内的所有客户，即创建房间的人和加入房间的人。但是，我无法将数据传递给客户端。控制台状态为客户端XXX设置心跳超时。

io.on('connection', function(socket){
    var roomCode = "";
    socket.on('createRoom',function(data){
        roomCode = data;
        //create route for the hash URL        
          app.get('/'+roomCode, function(req, res){
            socket.join(roomCode);  //join room
            res.render('room',{roomNum:roomCode});
        });
        //response redirect to roomList.ejs
        socket.emit('redirect', "https://chess-ivanhoe0523.c9users.io:8081/"+roomCode);

      });
     socket.on('joinRoom',function(data){ 
         roomCode = data;
         socket.join(roomCode);
        socket.to(roomCode).emit('PlayerNum','2');
         socket.emit('redirect', "https://chess-ivanhoe0523.c9users.io:8081/"+roomCode);
        //  socket.emit('my PlayerNum', 2);
     });

})

app.js

<html>
    <head>
        <title>Chess Prototype</title>
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <link rel="stylesheet" href="css/bootstrap.min.css">
        <link rel="stylesheet" href="css/bootstrap-responsive.min.css">
        <link rel="stylesheet" href="css/index.css">
        <!--<script src="../socket.io/socket.io.js"></script>-->
        <script src="/socket.io/socket.io.js"></script>
        <script src="js/jquery.min.js"></script>
        <script src="js/index.js"></script>
        <script src="js/bootstrap.min.js"></script>
    </head>
    <body>
        <!-- Modal -->
        <div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
          <div class="modal-dialog" role="document">
            <div class="modal-content">
              <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                <h4 class="modal-title" id="myModalLabel">Enter room number</h4>
              </div>
              <div class="modal-body">
                 <input type="text" class="form-control" id="roomNum">
                 <br>
                  <button type="button" class="btn btn-default" onClick="joinRoom()">Join</button>
              </div>

            </div>
          </div>
        </div>

        <div class="container">
            <div class="row">
            <div class="character-box">
                <h1>Welcome</h1>


                <button type="button" class="btn btn-primary" data-toggle="modal" data-target="#myModal">Join Game</button>
                <button type="button" class="btn btn-success" onClick="createRoomReq()">Create Game</button>

                <!--</a>-->
                <script>
                    var socket = io.connect();
                    function randomHash()
                    {
                        var text = "";
                        var possible = "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789";

                        for( var i=0; i < 5; i++ )
                            text += possible.charAt(Math.floor(Math.random() * possible.length));

                        return text;
                    }

                    function createRoomReq(){
                        var randomCode = randomHash();
                        // alert(randomCode);
                        socket.emit('createRoom', randomCode);
                    }

                    function joinRoom(){
                        var roomNum = document.getElementById("roomNum").value;
                        socket.emit('joinRoom', roomNum);
                    }

                    socket.on('redirect', function(destination) {
                        window.location.href = destination;
                    });
                </script>

                </a>

            </div>
            </div>

        </div>
    </body>
</html>

lobby.ejs

<html>
    <head><title>A room</title></head>
    <script src="/socket.io/socket.io.js"></script>
    <script>
     var socket = io.connect();
      socket.on('connectToRoom',function(data){
          document.body.innerHTML = '';
          document.write(data);
      });
       socket.on('PlayerNum',function(data){
           console.log("player num received from client: "data);
          document.getelementById("num").innerHTML = data;
      });
    </script>

    <body>
        You are in Room <%=  roomNum %>
        <br>
        Num of Players in the room: 
        <div id="num"></div>
    </body>
</html>

room.ejs

Answer 1

您想使用io.to(room).emit()代替socket.to(room).emit()

socket.io无法在房间内播放

1 个答案: