JavaScript

163 kenu
2012-03-20 14:21:55
http://www.okjsp.pe.kr
socket.io 시작하기

node.js와 npm이 설치된 상태에서 npm install socket.io 로 시작합니다.
그 다음엔 어쩌라고 입니다.

설명은 http://socket.io 사이트가 있는데, 초보자에게는 불친절합니다.
줘도 못 먹겠습니다.

그래서 쉽게 정리를 하려고 Outsider님 책보면서 정리하려고 합니다.
소스가 있습니다. 아무 이슈없습니다. ^^b

책의 첫 예제는 기를 죽입니다. 한 199 페이지가 다 소스.
그래서 시작은 위에서 불친절하다고 욕한 http://socket.io/#how-to-use 로 시작합니다.

npm install socket.io 가 되면

app.js 파일을 만듭니다. 서버에서 돌아가는 javascript입니다.
----
var app = require('http').createServer(handler)
  , io = require('socket.io').listen(app)
  , 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.sockets.on('connection', function (socket) {
  socket.emit('news', { hello: 'world' });
  socket.on('my other event', function (data) {
    console.log(data);
  });
});

----

그리고 클라이언트에서 돌아가는 index.html 입니다.
----
<script src="/socket.io/socket.io.js"></script>
<script>
  var socket = io.connect('http://localhost');
  socket.on('news', function (data) {
    console.log(data);
    socket.emit('my other event', { my: 'data' });
  });
</script>
----

폴더를 보면 다음과 같이 있습니다.
app.js
index.html
node_modules/

이제 다음 명령어로 서버를 띄우면 됩니다.
node app.js

80포트로 뜨기 때문에 root권한이 필요합니다. 권한이 없는 경우 다음과 같은 에러가 발생합니다.
gwang-nam-heoyi-macbook-pro:socket.io kenu$ node app.js
info - socket.io started
warn - error raised: Error: listen EACCES
gwang-nam-heoyi-macbook-pro:socket.io kenu$

 
sudo node app.js 
리눅스와 맥은 이렇게 실행하셔야 할 것입니다.


서버쪽에 다음과 같이 로그가 올라옵니다.

gwang-nam-heoyi-macbook-pro:socket.io kenu$ sudo node app.js
Password:
info - socket.io started
debug - served static content /socket.io.js
debug - client authorized
info - handshake authorized 21130281791178129285
debug - setting request GET /socket.io/1/websocket/21130281791178129285
debug - set heartbeat interval for client 21130281791178129285
debug - client authorized for
debug - websocket writing 1::
debug - websocket writing 5:::{"name":"news","args":[{"hello":"world"}]}
{ my: 'data' }
그리고 클라이언트 브라우저의 콘솔을 보면 다음과 같은 콘솔 로그를 볼 수 있습니다.

Object
hello: "world"
__proto__: Object

서버의 메시지{"hello":"world"}가 클라이언트로, 클라이언트의 메시지{my:'data'}가 서버로 전송되서 로그에 찍힌 것을 확인할 수 있습니다.

서버의 로그를 보시면 계속 주기적으로 심장박동(heartbeat)을 확인하는 로그가 올라가는 것을 볼 수 있습니다.

크롬 브라우저 Console에서 socket.emit('my other event', {my:'okjsp message'}); 입력하면 서버쪽에 전송된 메시지 로그가 찍힙니다.

이후는 Outsider님의 책을 참고로 해서 원하는 시점에 메시지를 주고 받을 수 있도록 코드를 개선시켜 나가보겠습니다.
to be continued...



  • 간단한 거지만 http://socketio-example.nodester.com/ 를 보셔도 통신을 어떻게 하는지 도움이 되실듯 합니다. nodester가 불안해서 종종 죽네요 ㅎㅎ 업글안해서 좀 예전버전이긴 하지만요
  • 4796Outsider
  • 2012-03-20 13:56:13
  • x
  • Outsider//감사합니다. ^^; 모니터링 하시는 것 같아요.
  • 163kenu
  • 2012-03-20 14:03:17
  • x
  • kenu님// ㅎㅎㅎㅎ node.js 설명하시는걸 거들뿐이죠 ㅎㅎ
  • 4796Outsider
  • 2012-03-20 15:29:07
  • x
  • 예제사이트 이해를 하기에 좋은 샘플들이네요. 감사합니다.
  • 163kenu
  • 2012-03-20 15:34:22
  • x
  • 오호 소켓 프로그램 쉬게 되네
  • 11674노츠개발
  • 2012-03-21 15:19:28
  • x
  • emit 으로 보내고 on 으로 받고 이 두가지만 생각하면 되요. ( 북치기 박치기 처럼..)
  • 17196inspiredjw
  • 2012-03-22 10:49:22
  • x



다음글 윈도우7에 express 설치하기
>> 141 socket.io 시작하기   [6] kenu 5047 2012-03-20 14:21:55
이전글 java RESTful 서비스를 node.js로 옮긴 이야기