遅ればせながらNode.js始めまして、チャットアプリを作ってみました。
なるべくソースが短くなるようにしてみました。
server.jsとindex.htmlをWebサーバの同じ場所に置いて
node server
で起動します。
ブラウザからサーバの3000番ポートを開いてチャットが出来ます。例http://example.com:3000
var html = require('fs').readFileSync('index.html');
var http = require('http').createServer(function(req, res) {
res.writeHead(200, {'Content-Type': 'text/html'});
res.end(html);
});
var io = require('socket.io')(http);
http.listen(3000);
io.on('connection', function(socket) {
socket.on('msg', function(data) {
io.emit('msg', data);
});
});
<!doctype html>
<meta charset="utf-8">
<title>chat</title>
<script src="/socket.io/socket.io.js"></script>
<script src="//code.jquery.com/jquery-2.1.3.min.js"></script>
<form><input></form><div></div>
<script>
var socket = io();
$('form').submit(function() {
socket.emit('msg', $('input').val());
$('input').val('');
return false;
});
socket.on('msg', function(data) {
$('div').prepend(data + '<br>');
});
</script>
##注意点
socket.ioモジュールの読み込みに失敗するときは以下のコマンドでインストールしてください。
npm install socket.io
外部公開する場合はサニタイズしてください。index.htmlの
$('div').prepend(data + '<br>');
の前に
data = $('<div/>').text(data).html();
と一行加えるとタグを無効化できます。
(追記2013/12/8 Thanks to @LightSpeedC さん)
readFileSync
メソッドの代わりに以下の様に createReadStream
と stream.Readable.pipe
を使うとブロックされずにパイプで繋いでファイルを流すことができます。
require('fs').createReadStream('index.html').pipe(res);
(追記終わり)