Socket.IOを利用する

Node.jsをインストールして、npmコマンドから "socket.io" モジュールを同ディレクトリにインストールしてください。
その後、同ディレクトリの app.js を起動して http://localhost:8080 にアクセスすると、最下部のフォームがチャットのように動作します。

このページに埋め込まれているSocket.IOクライアントコード

<form action="" method="post" onsubmit="return false;">
  <input type="text" class="text" style="width: 300px;" id="message"/>
  <input type="submit" class="button" style="padding:10px" onclick="sendMessage();" value="Send" />
</form>
<pre id="log" style="width: 300px;"></pre>
<script src="/socket.io/socket.io.js"></script>
<script>
  var sock = io.connect('http://localhost:8080');

  sock.on('public_room', function(data) {
    var msg = data.value.replace(/</g, '<').replace(/>/g, '>').replace(/¥n/g, '') + '¥n';
    var content = document.querySelector('#log').textContent;
    document.querySelector('#log').textContent = msg + content;
  });
 
  function sendMessage(msg) {
    sock.emit('public_room', { value: document.querySelector('#message').value });
  }
</script>
  

サーバーコード(app.js)の内容

var http = require('http');
var socketio = require('socket.io');
var fs = require('fs');

var server = http.createServer(function(req, res) {
  fs.readFile(__dirname + '/list.html', function(err, data) {
    if (err) {
      res.writeHead(500);
      res.end('Not Found: index.html');
      return;
    }

    res.writeHead(200, { 'Content-Type': 'text/html' });
    res.end(data);
  });
}).listen(8080);

var io = socketio.listen(server);
io.sockets.on('connection', function(socket) {
  socket.on('public_room', function(data) {
    io.sockets.emit('public_room', { value: data.value });
  });
});
  

フォームに入力された内容をサーバーに送信して、サーバから受信した内容をページ内に表示する簡易的なチャットシステム