웹소켓은 HTML5의 표준의 일부로 웹브라우저에서도 실시간 채팅같은 서비스를 만들수 있게 되었습니다.

그러나, HTML5의 웹소켓은 어떤 브라우저는 지원하기도, 지원하지 않기도하고 있죠...


브라우저별 웹소켓 지원여부

참고) http://caniuse.com/#feat=websockets


모든 웹브라우저가 HTML5에 통일된다면 그때는 웹소켓이 위력을 발휘할수 있다는 생각이 듭니다.

누구나 웹브라우저만으로도 C/S에서만 구동되는 기술들을 웹서비스에서도 구현이 가능하겠죠..


그러나, 웹소켓은 지금 당장 상용화 할수 있는 기술이 아닙니다. 웹브라우저가 모두지원하지 않기 때문이죠

그런데, 대안으로 Socket.IO라는 기술이 등장합니다.


Socket.IO는 브라우저 종류에 상관없이 실시간 웹을 구현할 수 있도록 한 기술이다.

Guillermo Rauch가 만든 Socket.IO는 WebSocket, FlashSocket, AJAX Long Polling, AJAX Multi part Streaming, IFrame, JSONP Polling을 하나의 API로 추상화한 것입니다.


브라우저 특성에 맞게 실시간 웹을 구현할 수 있게 도와주죠..


Socket.IO 공식사이트에 가면  How to use에 대한 프로토타입 코드가 있는데, 보시면 무한한 가능성과 상상을 하게되는군요..


서버는 node.js를 통해 구현할 수 있습니다. 


(서버)

var app = require('http').createServer(handler)
var io = require('socket.io')(app);
var fs = require('fs');

app.listen(80);

function handler (req, res) {
  fs.readFile(__dirname + '/index.html',
  function (err, data) {
    if (err) {
      res.writeHead(500);
      return res.end('Error loading index.html');
    }

    res.writeHead(200);
    res.end(data);
  });
}

io.on('connection', function (socket) {
  socket.emit('news', { hello: 'world' });
  socket.on('my other event', function (data) {
    console.log(data);
  });
});


(클라이언트)

<script src="/socket.io/socket.io.js"></script>
<script>
  var socket = io('http://localhost');
  socket.on('news', function (data) {
    console.log(data);
    socket.emit('my other event', { my: 'data' });
  });
</script>


참고) http://socket.io/docs/