1月 292011
Ruby & WebSockets: TCP for the Browser – igvita.comを参考にした。
■サーバー
サーバーはrubyのEventMachine::WebSocketを使った。
まずgemでインストールしておいて
gem install em-websocket
EM::runの中でEM::WebSocket.startするだけ。
1プロセスに複数クライアントつなぎっぱなしにして、全クライアントにまとめてメッセージを送るためにEM::Channelを使った。EM::WebSocketのexamplesの中に入ってたtwitterのstreamを流すサーバーでも使ってた。
EM::Channelにpushで何か入れると、あらかじめsubscribeで登録しておいたブロック全てにそれが渡されて実行される。onopenした時にsubscribeしておくとクライアントを管理できる。
server.rb
require 'rubygems'websocketのつなぎっぱなし感を試したかったので、EM::deferも回しておいて3時間ごとにEM::Channelに時刻をpushしてみた。全チャットクライアントに時刻が表示される。
require 'em-websocket'
MAX_LOG = 100
EM::run do
puts 'server start'
@channel = EM::Channel.new
@logs = Array.new
@channel.subscribe{|mes|
@logs.push mes
@logs.shift if @logs.size > MAX_LOG
}
EM::WebSocket.start(:host => "0.0.0.0", :port => 8080) do |ws|
ws.onopen{
sid = @channel.subscribe{|mes|
ws.send(mes)
}
puts "<#{sid}> connected!!"
@logs.each{|mes|
ws.send(mes)
}
@channel.push("hello <#{sid}>")
# channel登録時のidを使うためにonopen内で他のイベント登録を済ませる
ws.onmessage{|mes|
puts "<#{sid}> #{mes}"
@channel.push("<#{sid}> #{mes}")
}
ws.onclose{
puts "<#{sid}> disconnected"
@channel.unsubscribe(sid)
@channel.push("<#{sid}> disconnected")
}
}
end
EM::defer do
loop do
puts Time.now.to_s
@channel.push Time.now.to_s
sleep 60*60*3 # 3時間ごと
end
end
end
後から接続してきたクライアントのために、メモリ上に配列で100件ログを取っておくことにした。
新しいクライアントが来たらログの中身をまとめてsendする。プロセス自体はforkしないで全クライアントまとめて接続させてるからDBが必要ない。
サーバーは
ruby server/server.rbでport8080で起動する。
■クライアント
次にクライアント。
ごくふつうのjQueryを読み込んだhtmlを書いておいて、
new WebSocketでサーバーに接続してonmessageとonopenとoncloseイベントを登録して、WebSocket.send関数で送信するだけ。
サーバーが再起動した時にそなえてoncloseしたらsetIntervalで定期的に接続しなおすようにすると良さげ。
var ws = new WebSocket("ws://localhost:8080");
ws.onmessage = function(e){
trace(e.data);
};
ws.onclose = function(){
log("ws closed");
};
ws.onopen = function(){
log('connected!!');
};
$(function(){
$('input#post').click(function(){
var name = $('input#name').val();
var mes = $('input#message').val();
ws.send(name+" : "+mes);
$('input#message').val("");
});
});
function log(message){
trace("[log] "+message);
};
function trace(message){
var mes_div = $('<div />').html(message);
$('div#chat').prepend(mes_div);
};
■動作環境
rubyとem-websocketがインストールされてればどこでも動かせる。
websocketは、httpの80番portと別のportで起動しないとならんのでさくらのVPSにubuntu10.04入れたサーバーで動かしてる。
server.rbのプロセスが死んでも復活するようにdaemontools使った。