Node.jsにてsocket.ioのjoinでチャットルーム実装!
JavaScript Advent Calendar 2011(Node.js/WebSocketsコース) 22日目です!
急遽参戦!そして初Advent Calendar...
Node.jsでのチャットルームの実装にsocket.ioのjoin()を使ってみます。
はじめに
socket.ioを利用したチャット機能の実装については
サンプルも多く結構簡単に実装が可能です。
ですが、チャットルームの実装方法については情報が少なく
やり方がわからなかったので色々調べつつ
RoomList, Room, User クラスを自作することで対応を行いました。
※sample
https://github.com/hekyou/socket_io-not-join-sample
ですが、、
最近socket.ioにjoinメソッドがあることを知りまして。
これなら簡潔に書けるじゃん...
と、思ったので試してみました。
環境
Mac OS X Snow Leopard 10.6.8 (Lionっておいしいの?)
Node.js 0.4.12 (0.6にしないと!)
socket.io 0.8.5
利用するメソッド
join(room)
roomに指定した部屋に参加することができる。
to(room).emit
roomに指定した部屋にのみメッセージを送れる。
実装
サーバ側
var io = require('socket.io').listen(app); chat = io.sockets.on('connection', function(client) { // ※2 クライアントに接続成功を送信 client.emit('connected'); client.on('init', function(req) { client.set('room', req.room); client.set('name', req.name); chat.to(req.room).emit('message', req.name + " さんが入室"); // ※4 クライアントを部屋に入室させる client.join(req.room); }); client.on('message', function(data) { var room, name; client.get('room', function(err, _room) { room = _room; }); client.get('name', function(err, _name) { name = _name; }); // ※6 受け取ったメッセージを部屋の皆に送信 chat.to(room).emit('message', name + ": " + data); }); // ※8 退室 client.on('disconnect', function() { var room, name; client.get('room', function(err, _room) { room = _room; }); client.get('name', function(err, _name) { name = _name; }); client.leave(room); chat.to(room).emit('message', name + " さんが退出"); }); });
クライアント側
// ※1 サーバに接続リクエスト var socket = io.connect('/'); function chat(room, name) { socket.on('connected', function() { // ※3 入室する部屋番号を送信 socket.json.emit('init', { 'room': room, 'name': name }); }); // ※7 受け取ったメッセージを表示 socket.on('message', function(data) { if (data) { update(data); } }); } function send(name) { var data = $('#comment').val(); // ※5 メッセージを送信 socket.json.send(data); $('#comment').val(""); } function update(data) { var obj = $(document.createElement('div')); obj.html(data); $('#view').append(obj); }
大分すっきりしました!!
もっと早く知っていれば...
ちなみに、※番号は一応処理の順番になっています。
今回この記事用に作成したものが下記になります。
https://github.com/hekyou/socket_io-join-sample
ちなみに独自クラスを使って作成したサービスが下記になります。
blockdiagをみんなで編集しよう的なものです。
http://live-diag.herokuapp.com/
※blockdiagについてはこちらを参照してください。便利ですヨ!
http://blockdiag.com/ja/blockdiag/
後でjoinで書き直そうっと...
備考
to(room).send は使えなくてちょっとだけハマりました。