이 글은 제가 socket.io를 사용하면서 readme 파일을 안되는 실력으로 번역 한 것 입니다.
원본 : http://artworker.storylang.com/story/to/36
Socket.io는 Node.js 의 프로젝트중 하나로 모든 브라우저에서 실시간 웹을 구현 가능하도록 만들어 준다. 또한, WebSockets를 다양하고, 확장가능하도록 향상 시키며 자동으로 JSON을 인코딩 디코딩 한다.
========================================================
인스톨 방법
npm install socket.io
npm이 설치 되어 있어야 합니다.
사용방법
첫번째로 socket.io 를 가져옵니다.
var io = require('socket.io');
기본적으로 외부 라이브러리를 가져올 경우 require라는 메서드를 사용합니다.
다음으로 http/https 를 생성합니다.(아래 예는 node.js의 또 다른 프로젝트인 express를 함께 사용할 경우 예제 입니다)
var express = require('express'), //express를 가져오기
app = express.createServer(), //express를 이용 서버 생성
, io = io.listen(app); // io에 app 등록
app.listen(80); //포트 지정
io.sockets.on('connection', function (socket) { //소켓 연결 성공시
socket.emit('news', { hello: 'world' }); //클라이언트의 news 함수 실행
socket.on('my other event', function (data) { //my other event 함수 생성
console.log(data);//콘솔 출력
});
});
마지막으로 클라이언트 코드를 작성 합니다.
<script src="/socket.io/socket.io.js"></script>//기본적으로 필요한 클라이언트 스크립트
<script>
var socket = io.connect('http://localhost'); //소켓 생성
socket.on('news', function (data) { //news 함수 생성
console.log(data); //콘솔 출력
socket.emit('my other event', { my: 'data' }); //서버 my other event 함수 실행
});
</script>
이제 웹상에서 실행해 보면 로그창에 다음과 같이 출력 되는 것을 확인 가능 합니다.
{ hello: 'world' }
기타 추가적인 예제는 예제 디렉토리를 확인해 주세요.
네임스페이스 생성
네임스페이스의 핵심은 하나의 웹소켓 연결로 여러 연결을 처리 하는 것을 말합니다.
서버 코드
var io = require('socket.io').listen(80);
var chat = io
.of('/chat');
.on('connection', function (socket) {
socket.emit('a message', { that: 'only', '/chat': 'will get' });
chat.emit('a message', { everyone: 'in', '/chat': 'will get' });
});
var news = io
.of('/news');
.on('connection', function (socket) {
socket.emit('item', { news: 'item' });
});
클라이언트 코드
<script>
var chat = io.connect('http://localhost/chat')
, news = io.connect('http://localhost/news');
chat.on('connect', function () {
chat.emit('hi!');
});
news.on('news', function () {
news.emit('woot');
});
</script>
휘발성 메세지 보내기
클라이언트가 부득이 하게 내가 보낸 메세지를 받지 못할 경우가 있습니다. 네트워크가 느리다거나 롱폴링으로 연결이 되어 있는 경우등이 있을 수 있습니다. 만일 클라이언트가 메세지를 받지 못한경우를 대비해 휘발성 메세지를 사용합니다.(대충, 코드를 보면 클라이언트가 메세지를 받을때 까지 지속적으로 메세지를 보내는 성질의 기능인 듯하나, 확실하지 않다, 추후에 수정 할 예정)
서버 코드
var io = require('socket.io').listen(80);
io.sockets.on('connection', function (socket) {
var tweets = setInterval(function () {
getBieberTweet(function (tweet) {
socket.volatile.emit('bieber tweet', tweet); //volatile 이 핵심 메서드
});
}, 100);
socket.on('disconnect', function () {
clearInterval(tweets);
});
});
클라이언트 코드
클라이언트의 경우 기존과 같은 방법으로 주고 받습니다.
메세지 응답(콜백) 받기
가끔 내가 보낸 메세지를 수신했는지 알아보고 싶을 경우가 있습니다.
.send와 .emit을 이용하여 간단히 마지막 파라미터로 함수를 넘겨 줄 수 있습니다.
.emit을 사용하면 응답은 내가 보낸 함수를 실행하게 됩니다.
서버 코드
var io = require('socket.io').listen(80);
io.sockets.on('connection', function (socket) {
socket.on('ferret', function (name, fn) {
fn('woot');
});
});
클라이언트 코드
<script>
var socket = io.connect(); // TIP: .connect with no args does auto-discovery
socket.on('connection', function () {
socket.emit('ferret', 'tobi', function (data) {
console.log(data); // data will be 'woot'
});
});
</script>
메세지 전달하기
메세지는 간편하게 broadcast에 .emit과 .send 메서드를 호출 하여 사용가능 합니다.
Broadcating은 나를 제외한 모두를 뜻합니다.
서버코드
var io = require('socket.io').listen(80);
io.sockets.on('connection', function (socket) {
socket.broadcast.emit('user connected');
socket.broadcast.json.send({ a: 'message' });
});
그룹 만들기
소켓을 위한 채널을 생각하면 됩니다. 어떤 특정 그룹안에 모든 사용자들에게 메세지를 보내고 싶을때 유용하며
sockets에 .join과 .leave을 사용합니다.
서버 코드
var io = require('socket.io').listen(80);
io.sockets.on('connection', function (socket) {
socket.join('justin bieber fans');
socket.broadcast.to('justin bieber fans').emit('new fan');
io.sockets.in('rammstein fans').emit('new non-fan');
});
크로스 브라우저 웹소켓 사용하기
간단히 .send로 보내고 message 이벤트로 받아 사용 가능합니다.
서버 코드
var io = require('socket.io').listen(80);
io.sockets.on('connection', function (socket) {
socket.on('message', function () { });
socket.on('disconnect', function () { });
});
클라이언트 코드
<script>
var socket = io.connect('http://localhost/');
socket.on('connect', function () {
socket.send('hi');
socket.on('message', function (msg) {
// my msg
});
});
</script>
설정 변경하기
Tj-style로 socket.io의 설정을 변경할 수 있습니다.
서버 코드
var io = require('socket.io').listen(80);
io.configure(function () {
io.set('transports', ['websocket', 'flashsocket', 'xhr-polling']);
});
io.configure('development', function () {
io.set('transports', ['websocket', 'xhr-polling']);
io.enable('log');
});
영삼넷
Categories
Recent Posts
Recent Comments
Statistics
- Total Visitors:
- 411029
- Today:
- 684209
- Yesterday:
- 9756951
IT강국 김영삼 블로그에 오신걸 진심으로 환영합니다.
©2002 영삼넷 // openkr
©2002 영삼넷 // openkr