web-dev-qa-db-ja.com

Socket.ioとNode

Socket.io v.7の新しい「ルーム」機能を使用して動的チャットルームを作成しようとしていますが、この例では静的ルームを機能させるのに問題があります。ユーザーが選択したURLに基​​づいて、部屋1または部屋2に移動する必要があります。ユーザーがチャットに入力したものはすべて、同じ部屋のユーザーにブロードキャストする必要があります。私は2つのブラウザー（クロムとff）を使用しており、それぞれに/ room1と/ room2にタブが開いていますが、入力したものは他のタブにブロードキャストされていないようです。何が悪いのですか？

サーバーコード

var app = require('express').createServer();
var io = require("socket.io").listen(app);

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

    // join to room and save the room name
    socket.on('join room', function (room) {
        socket.set('room', room, function() { console.log('room ' + room + ' saved'); } );
        socket.join(room);
    })

    socket.on('message', function(data) {
        console.log("Client data: " + data);

        // lookup room and broadcast to that room
        socket.get('room', function(err, room) {
            //room example - https://github.com/learnboost/socket.io
            // neither method works for me
            socket.broadcast.to(room).emit('new fan');
            io.sockets.in(room).emit('new non-fan');
        })
    })
});

app.get('/room1', function(req, res){       
    res.render('example2-client.ejs', {layout:false});
});

app.get('/room2', function(req, res){       
    res.render('example2-client-2.ejs', {layout:false});
});

app.listen(4000);

クライアントコードルーム1

<!DOCTYPE HTML>
<html><head>
<title>Code review for Snipet</title>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js"></script>
<script type="text/javascript" src="http://localhost:4000/socket.io/socket.io.js"></script>
<script>
$(document).ready(function() { 
    var socket = io.connect('http://localhost:4000');

    $("#msgbox").keypress( function(event) {
         if (event.which == '13') {
            sendmsg();
            event.preventDefault();
        }
    });     

    socket.on('connect', function (data) {
        socket.emit('join room', 'room1' );
    });

    socket.on('message', function (data) {
        add_message(data);
    });

    function add_message(m) {
        $("#chatlog").append(m);
        $("#chatlog").append("<BR>");
    }

    function sendmsg()
    {
        var r = $("#msgbox").val();
        socket.emit('message', r );
        add_message(r);
        $("#msgbox").val('');
    }       

});
</script>
</head>
<body>
<div id="chat" style="height: 200px; width: 200px; border: 1px solid grey;">
<div id="chatlog" style="height: 178px; width: 200px; overflow-y: scroll;"></div>
<input type="text" id="msgbox" style="margin-left: 2px; width: 193px;">
</div>
</body>
</html>

クライアントコード2

<!DOCTYPE HTML>
<html><head>
<title>Code review for Snipet</title>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js"></script>
<script type="text/javascript" src="http://localhost:4000/socket.io/socket.io.js"></script>
<script>
$(document).ready(function() { 
    var socket = io.connect('http://localhost:4000');

    $("#msgbox").keypress( function(event) {
         if (event.which == '13') {
            sendmsg();
            event.preventDefault();
        }
    });     

    socket.on('connect', function (data) {
        socket.emit('join room', 'room2' );
    });

    socket.on('message', function (data) {
        add_message(data);
    });

    function add_message(m) {
        $("#chatlog").append(m);
        $("#chatlog").append("<BR>");
    }

    function sendmsg()
    {
        var r = $("#msgbox").val();
        socket.emit('message', r );
        add_message(r);
        $("#msgbox").val('');
    }       

});
</script>
</head>
<body>
<div id="chat" style="height: 200px; width: 200px; border: 1px solid grey;">
<div id="chatlog" style="height: 178px; width: 200px; overflow-y: scroll;"></div>
<input type="text" id="msgbox" style="margin-left: 2px; width: 193px;">
</div>
</body>
</html>
node.jssocket.io
23
Rick

これらのイベントを聞いていないようです

socket.broadcast.to(room).emit('new fan');
io.sockets.in(room).emit('new non-fan');

クライアント側で必要なもの：

socket.on('new fan', function (data) {
    console.log('new fan');
});

また、クライアントにメッセージを送信していません。内部：

socket.on('message', function(data) { })

サーバーでは、あなたがする必要があります：

io.sockets.in(room).emit('message', data);
35
Cris-O