Socket.io: socket.io๊ฐ€ websocket ์—ฐ๊ฒฐ๊ณผ xhr ํด๋ง์„ ๋ณ‘๋ ฌ๋กœ ์‚ฌ์šฉํ•˜๋Š” ์ด์œ ๋Š” ๋ฌด์—‡์ž…๋‹ˆ๊นŒ?

์— ๋งŒ๋“  2012๋…„ 08์›” 12์ผ  ยท  45์ฝ”๋ฉ˜ํŠธ  ยท  ์ถœ์ฒ˜: socketio/socket.io

์•ˆ๋…•,

๋‚˜๋Š” socket.io๋ฅผ ์ฒ˜์Œ ์‚ฌ์šฉํ•˜๊ณ  socket.io๊ฐ€ ๋‘ ๊ฐœ์˜ ์—ฐ๊ฒฐ์„ ์œ ์ง€ํ•˜๋Š” ์ด์œ ๊ฐ€ ๊ถ๊ธˆํ•ฉ๋‹ˆ๋‹ค.

  1. ์›น ์†Œ์ผ“
  2. XHR ํด๋ง

๋™์‹œ์—?

์ด๊ฑด ์ข€ ๋ฉ์ฒญํ•˜์ง€ ์•Š์•„?

๊ฐ€์žฅ ์œ ์šฉํ•œ ๋Œ“๊ธ€

@rohittailor : ํด๋ผ์ด์–ธํŠธ์—์„œ ์ด๊ฒƒ์„ ํ…Œ์ŠคํŠธํ•˜๊ณ  ์žˆ์Šต๋‹ˆ๋‹ค.

    <script src="/socket.io/socket.io.js"></script>
    <script>
        var socket = io.connect({transports: ['websocket']});
    </script>

๊ทธ๋ฆฌ๊ณ  ์ง€๊ธˆ๊นŒ์ง€ ๋„ˆ๋ฌด ์ข‹์Šต๋‹ˆ๋‹ค. XHR ์—ฐ๊ฒฐ์„ ์™„์ „ํžˆ ํ”ผํ•˜๊ณ  ์žˆ์Šต๋‹ˆ๋‹ค.

๋ชจ๋“  45 ๋Œ“๊ธ€

  • "XHR ํด๋ง"์€ ์—ฐ๊ฒฐ์ด ์•„๋‹ˆ๋ฉฐ ๋‘˜ ์ด์ƒ์˜ ์—ฐ๊ฒฐ์„ ์‚ฌ์šฉํ•  ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค.
  • ์›น ์†Œ์ผ“ ๋ฐ ํด๋ง ์ „์†ก์€ ์•„์ง ๋™์‹œ์— ์ดˆ๊ธฐํ™”๋˜์ง€ ์•Š์Šต๋‹ˆ๋‹ค. ์‚ฌ์‹ค ์ด๊ฒƒ์ด ๋ฐ”๋กœ engine.io๊ฐ€ ํ•˜๋Š” ์ผ์ด๋ฉฐ socket.io๊ฐ€ ๊ตฌํ˜„ํ•˜๋ฉด ๊ณง ํ•  ์ผ์ž…๋‹ˆ๋‹ค. ์—ฌ๊ธฐ์—์„œ ์ž์„ธํžˆ ์ฝ๊ณ  "๋ฐ”๋ณด ๊ฐ™์€" ๋ ˆ์ด๋ธ”์„ ๋‹ค์‹œ ๊ณ ๋ คํ•  ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค.

socket.io 0.9์— ๋™์‹œ์— ๋‘ ๊ฐœ์˜ ์—ด๋ฆฐ ์ „์†ก์ด ์žˆ๋Š” ์ƒํ™ฉ์ด ๋ฐœ์ƒํ•˜๋ฉด ๋ฒ„๊ทธ์ผ ์ˆ˜ ์žˆ์œผ๋ฉฐ ์ด๋ฅผ ์žฌํ˜„ํ•˜๋Š” ๋ฐฉ๋ฒ•์— ๋Œ€ํ•œ ์ถ”๊ฐ€ ์ •๋ณด๋ฅผ ์ฃผ์‹œ๋ฉด ๊ฐ์‚ฌํ•˜๊ฒ ์Šต๋‹ˆ๋‹ค.

"XHR ํด๋ง"์€ ์—ฐ๊ฒฐ์ด ์•„๋‹ˆ๋ฉฐ ๋‘˜ ์ด์ƒ์˜ ์—ฐ๊ฒฐ์„ ์‚ฌ์šฉํ•  ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค.

๋„ค, ํ•˜์ง€๋งŒ ํด๋ง์€ ๋ชจ๋“  ์š”์ฒญ์ด ๋™์ผํ•œ URL์—์„œ ์ž‘๋™ํ•˜๊ธฐ ๋•Œ๋ฌธ์ž…๋‹ˆ๋‹ค. ๋‚˜๋Š” ๊ทธ๊ฒƒ์ด ํ•˜๋‚˜๋ฅผ ๋ชจ๋ฐฉํ•ด์•ผํ•œ๋‹ค๊ณ  ๊ฐ€์ •ํ•ฉ๋‹ˆ๋‹ค.

socket.io 0.9์— ๋™์‹œ์— ๋‘ ๊ฐœ์˜ ์—ด๋ฆฐ ์ „์†ก์ด ์žˆ๋Š” ์ƒํ™ฉ์ด ๋ฐœ์ƒํ•˜๋ฉด ๋ฒ„๊ทธ์ผ ์ˆ˜ ์žˆ์œผ๋ฉฐ ์ด๋ฅผ ์žฌํ˜„ํ•˜๋Š” ๋ฐฉ๋ฒ•์— ๋Œ€ํ•œ ์ถ”๊ฐ€ ์ •๋ณด๋ฅผ ์ฃผ์‹œ๋ฉด ๊ฐ์‚ฌํ•˜๊ฒ ์Šต๋‹ˆ๋‹ค.

์šฐ๋ฆฌ๊ฐ€ ๊ฐ™์€ ์˜๋ฏธ์ธ์ง€ ํ™•์‹คํ•˜์ง€ ์•Š์ง€๋งŒ Chromium์€ ์—ด๋ฆฐ ์›น ์†Œ์ผ“ ์—ฐ๊ฒฐ์„ ๋ณด์—ฌ์ฃผ๊ณ  ๋˜ํ•œ socket.io์— ํด๋ง ์š”์ฒญ์„ ๋ณด๋‚ด๊ณ  ์žˆ์Šต๋‹ˆ๋‹ค.
"๋ฐ”๋ณด"๋Š” ์ด์ œ ์‚ฌ์šฉ ๊ฐ€๋Šฅํ•œ ์›น ์†Œ์ผ“ ์—ฐ๊ฒฐ ๋ฐ ํด๋ง์˜ ์ด์ ์„ ๋”ฐ๋ฅผ ์ˆ˜ ์—†์Œ์„ ์˜๋ฏธํ•ฉ๋‹ˆ๋‹ค.
websocket ์—ฐ๊ฒฐ ์ž์ฒด๋กœ ์ถฉ๋ถ„ํ•˜๊ณ  xhr ํด๋ง์€ ํด๋ฐฑ์œผ๋กœ๋งŒ ์‚ฌ์šฉ๋˜์–ด์•ผ ํ•˜์ง€ ์•Š์Šต๋‹ˆ๊นŒ?

๋‚ด๊ฐ€ ๋ญ”๊ฐ€๋ฅผ ๋†“์นœ ๊ฒฝ์šฐ ๋‚˜๋ฅผ ์ˆ˜์ •

@bodokaiser ๋Š” websocket ์—ฐ๊ฒฐ์ด ์‹ค์ œ๋กœ ์ž‘๋™

ํ•ธ๋“œ์…ฐ์ดํฌ๋Š” ์ผ๋ฐ˜ HTTP์ž…๋‹ˆ๋‹ค.

Chrome ์›น ์†Œ์ผ“ ์—ฐ๊ฒฐ์ด ๋ณด๋ฅ˜ ์ค‘์ด๋ผ๊ณ  ํ‘œ์‹œํ•ฉ๋‹ˆ๋‹ค. ์˜ค๋ฅ˜ ๋ฉ”์‹œ์ง€๊ฐ€ ์—†์Šต๋‹ˆ๋‹ค. ๋‚˜๋Š” ws๊ฐ€ ์ž‘๋™ํ•œ๋‹ค๊ณ  ๊ฐ€์ •ํ•ฉ๋‹ˆ๋‹ค. ๊ทธ๋Ÿผ์—๋„ ๋ถˆ๊ตฌํ•˜๊ณ  socket.io๊ฐ€ ํด๋ฐฑ๋˜๋Š”์ง€ ์–ด๋–ป๊ฒŒ ํ™•์ธํ•  ์ˆ˜ ์žˆ์Šต๋‹ˆ๊นŒ?

๋„ค, ํ™•์‹คํžˆ ์•…์ˆ˜๋Š” ์•„๋‹™๋‹ˆ๋‹ค. ํฌ๋กฌ๊ณผ ๋…ธ๋“œ ์ฝ˜์†”์—์„œ get ์š”์ฒญ์ด 2000ms๋งˆ๋‹ค ์–ด๋–ป๊ฒŒ ๋ฐ˜๋ณต๋˜๋Š”์ง€ ๋ด…๋‹ˆ๋‹ค.

node.js ๋กœ๊น…์ด ๋„์›€์ด ๋ ๊นŒ์š”?

๋ฌธ์•ˆ ์ธ์‚ฌ

ws ์—ฐ๊ฒฐ์—์„œ ๊ตํ™˜๋œ ํ”„๋ ˆ์ž„์„ ๊ฒ€์‚ฌํ•ฉ๋‹ˆ๋‹ค(Chrome์—๋งŒ ์žˆ๋Š” ๊ฒƒ ๊ฐ™์Šต๋‹ˆ๋‹ค). ๋ฐ์ดํ„ฐ๊ฐ€ ํ‘œ์‹œ๋˜์ง€ ์•Š์œผ๋ฉด ์ž‘๋™ํ•˜์ง€ ์•Š์€ ๊ฒƒ์ž…๋‹ˆ๋‹ค.

์˜ˆ, ์ง€์›ํ•˜๋Š” ๊ฒƒ ๊ฐ™์Šต๋‹ˆ๋‹ค.

  debug - client authorized
   info  - handshake authorized yUEmr7drZfmWzWHdEZcp
GET /socket.io/1/?t=1344799805756 200 3ms
   debug - setting request GET /socket.io/1/xhr-polling/yUEmr7drZfmWzWHdEZcp?t=1344799815866
   debug - setting poll timeout
   debug - client authorized for 
   debug - clearing poll timeout
   debug - xhr-polling writing 1::
   debug - set close timeout for client yUEmr7drZfmWzWHdEZcp
GET /socket.io/1/xhr-polling/yUEmr7drZfmWzWHdEZcp?t=1344799815866 200 1ms
   debug - xhr-polling received data packet 5:::{"name":"hello","args":["world"]}
POST /socket.io/1/xhr-polling/yUEmr7drZfmWzWHdEZcp?t=1344799815871 200 1ms
   debug - setting request GET /socket.io/1/xhr-polling/yUEmr7drZfmWzWHdEZcp?t=1344799815872
   debug - setting poll timeout
   debug - discarding transport
   debug - cleared close timeout for client yUEmr7drZfmWzWHdEZcp
   debug - clearing poll timeout
   debug - xhr-polling writing 8::
   debug - set close timeout for client T9eCOR7gCe3pLNtiEZco
   debug - xhr-polling closed due to exceeded duration
GET /socket.io/1/xhr-polling/T9eCOR7gCe3pLNtiEZco?t=1344799800945 200 20002ms
   debug - clearing poll timeout
   debug - xhr-polling writing 8::
   debug - set close timeout for client yUEmr7drZfmWzWHdEZcp
   debug - xhr-polling closed due to exceeded duration

@guille ๋Œ€์ฒด ์ด์œ ๋ฅผ

์–ด๋–ค ๋ธŒ๋ผ์šฐ์ €๋ฅผ ์‚ฌ์šฉํ•˜๊ณ  ์žˆ์Šต๋‹ˆ๊นŒ?

Mac OSX์šฉ ํฌ๋กฌ 21

Chrome 21/Windows 21.0.1180.79 m์—์„œ๋„ ๋™์ผํ•œ ๋ฌธ์ œ๊ฐ€ ๋ฐœ์ƒํ•ฉ๋‹ˆ๋‹ค. ์—ฐ๊ฒฐ๋˜์ง€ ์•Š๋Š” ๋™์‹œ WebSocket ์—ฐ๊ฒฐ์ด ์žˆ๋Š” JSONP ํด๋ง ์—ฐ๊ฒฐ(์„ฑ๊ณต์ ์œผ๋กœ ๋ณด์ž„)์ด ์žˆ์Šต๋‹ˆ๋‹ค. ์ด ์—ฐ๊ฒฐ์€ ํ•ญ์ƒ "๋ณด๋ฅ˜ ์ค‘" ์ƒํƒœ์ž…๋‹ˆ๋‹ค. Mac์—์„œ ๋™์ผํ•œ ๋ฒ„์ „์˜ Chrome์„ ์‚ฌ์šฉํ•ด๋„ ๊ดœ์ฐฎ์Šต๋‹ˆ๋‹ค.

์ด๊ฒƒ์€ ๋ฐฉํ™”๋ฒฝ์ด๋‚˜ ๋ฐ”์ด๋Ÿฌ์Šค ๋ฐฑ์‹ ๊ณผ ๊ด€๋ จ๋œ ๊ฒƒ์œผ๋กœ ๋ณด์ด์ง€ ์•Š์œผ๋ฉฐ ๋ชจ๋“  ํ…Œ์ŠคํŠธ๋Š” websocketstest.org ๋ฐ websocket.org/echo.html์„ ํ†ต๊ณผํ•ฉ๋‹ˆ๋‹ค.

๋‚˜๋Š” socket.io 0.9๋ฅผ ์‚ฌ์šฉํ•˜๊ณ  ์žˆ์ง€๋งŒ ์ตœ์‹  ๋ฒ„์ „์—๋„ ์กด์žฌํ•˜๋Š” ๊ฒƒ ๊ฐ™์Šต๋‹ˆ๋‹ค.

@guille ์ด ๋ฌธ์ œ๋„ ์žฌํ˜„ํ•˜๊ธฐ ์‰ฌ์šด ๊ฒƒ ๊ฐ™์Šต๋‹ˆ๋‹ค. ๋ฐฉ๊ธˆ socket.io์˜ WebSocket ์ „์†ก์„ ์‚ฌ์šฉํ•˜๋Š” ์‚ฌ์ดํŠธ๋ฅผ ๋ฐฉ๋ฌธํ–ˆ์Šต๋‹ˆ๋‹ค.

http://beta.blaggart.com

์ ์–ด๋„ Windows์˜ Chrome 21์—์„œ๋Š” WS ์—ฐ๊ฒฐ ์ƒํƒœ๊ฐ€ ํ•ญ์ƒ "๋Œ€๊ธฐ ์ค‘"์ž…๋‹ˆ๋‹ค.

socket.io ๋งˆ์Šคํ„ฐ๋กœ ์‹œ๋„ ํ•˜์‹œ๊ฒ ์Šต๋‹ˆ๊นŒ?

๋ฐฉ๊ธˆ ๋งˆ์Šคํ„ฐ๋ฅผ ์‹œ๋„ํ–ˆ๋Š”๋ฐ ๋™์ผํ•œ ๋ฌธ์ œ๊ฐ€ ์žˆ์Šต๋‹ˆ๋‹ค. ์ด ๋ฌธ์ œ๋Š” #998์˜ ์†์ž„์ˆ˜์ผ ์ˆ˜๋„ ์žˆ์Šต๋‹ˆ๋‹ค.

๋˜ํ•œ ๊ฐ€์น˜๊ฐ€ ์žˆ๋‹ค๋Š” ์ ์—์„œ #998์— ์„ค๋ช…๋œ ํ•ด๊ฒฐ ๋ฐฉ๋ฒ•์€ ์›น ์†Œ์ผ“์„ ๋น„ํ™œ์„ฑํ™”ํ•˜๊ณ  xhr ๋ฐ jsonp ํด๋ง๋งŒ ์‚ฌ์šฉํ•˜์—ฌ ์—ฐ๊ฒฐ์„ ์„ค์ •ํ•˜๋Š” ๋ฐ ํšจ๊ณผ์ ์ด์—ˆ์Šต๋‹ˆ๋‹ค.

์ด๊ฒƒ์€ ์‹ค์ œ๋กœ ํฌ๋กฌ ๋ฒ„๊ทธ์ž…๋‹ˆ๊นŒ?

www.websocket.org/echo.html ์—์„œ ํ…Œ์ŠคํŠธ๋ฅผ ํ•  ๋•Œ

์žฌ๋ฏธ์žˆ๋Š” ์ ์€ ๋™์ผํ•œ ์›น ์‚ฌ์ดํŠธ์—์„œ "๋ณด์•ˆ WebSocket(TLS)"์„ ์‚ฌ์šฉํ•˜๋ฉด websocket์ด ์ž‘๋™ํ•œ๋‹ค๋Š” ๊ฒƒ์ž…๋‹ˆ๋‹ค.

Chrome๊ณผ Firefox ๋ชจ๋‘์—์„œ ์ •ํ™•ํžˆ ๊ฐ™์€ ๋™์ž‘์ž…๋‹ˆ๋‹ค. ๋งค์šฐ ์ด์ƒํ•ฉ๋‹ˆ๋‹ค.

์„ฌ๊ธฐ๋Š” ์‚ฌ๋žŒ:

socket.on('loginout',function(){
    socket.emit('loginout',{uname:socket.name});
});

socket.on('๋กœ๊ทธ์ธ',ํ•จ์ˆ˜(๋ฐ์ดํ„ฐ){
socket.emit('l_msg',{uname:data.uname,score:data.score,์œ ํ˜•:true});
});

์ธ์‡„:
์ •๋ณด: ์•…์ˆ˜ ์ธ์ฆ 11012331592122282453
๋””๋ฒ„๊ทธ: ์„ค์ • ์š”์ฒญ GET /socket.io/1/xhr-polling/11012331592122282453?t=1353485202761
๋””๋ฒ„๊ทธ: ํด๋ง ์‹œ๊ฐ„ ์ดˆ๊ณผ ์„ค์ •
๋””๋ฒ„๊ทธ: ์Šน์ธ๋œ ํด๋ผ์ด์–ธํŠธ
๋””๋ฒ„๊ทธ: ํด๋ง ์‹œ๊ฐ„ ์ดˆ๊ณผ ์ง€์šฐ๊ธฐ
๋””๋ฒ„๊ทธ: xhr-polling ์“ฐ๊ธฐ 1::
๋””๋ฒ„๊ทธ: ํด๋ผ์ด์–ธํŠธ 11012331592122282453์— ๋Œ€ํ•œ ๋‹ซ๊ธฐ ์‹œ๊ฐ„ ์ดˆ๊ณผ ์„ค์ •
๋””๋ฒ„๊ทธ: xhr-polling ์ˆ˜์‹  ๋ฐ์ดํ„ฐ ํŒจํ‚ท 20.5:::{"name":"count"}.22.5:::{"name":"history"}.23.5:::{"name ":"์‚ฌ์šฉ์ž ๋ชฉ๋ก"}
๋””๋ฒ„๊ทธ: ์„ค์ • ์š”์ฒญ GET /socket.io/1/xhr-polling/11012331592122282453?t=1353485202792
๋””๋ฒ„๊ทธ: ํด๋ง ์‹œ๊ฐ„ ์ดˆ๊ณผ ์„ค์ •
๋””๋ฒ„๊ทธ: ์ „์†ก ํ๊ธฐ
๋””๋ฒ„๊ทธ: ํด๋ผ์ด์–ธํŠธ 11012331592122282453์— ๋Œ€ํ•œ ๋‹ซ๊ธฐ ์‹œ๊ฐ„ ์ดˆ๊ณผ๋ฅผ ์ง€์› ์Šต๋‹ˆ๋‹ค.
๋””๋ฒ„๊ทธ: ํด๋ง ์‹œ๊ฐ„ ์ดˆ๊ณผ ์ง€์šฐ๊ธฐ
๋””๋ฒ„๊ทธ: xhr-polling ์“ฐ๊ธฐ 8::
๋””๋ฒ„๊ทธ: ํด๋ผ์ด์–ธํŠธ 1896586469607627233์— ๋Œ€ํ•œ ๋‹ซ๊ธฐ ์‹œ๊ฐ„ ์ดˆ๊ณผ ์„ค์ •
๋””๋ฒ„๊ทธ: ์ดˆ๊ณผ๋œ ๊ธฐ๊ฐ„์œผ๋กœ ์ธํ•ด xhr-polling์ด ์ข…๋ฃŒ๋˜์—ˆ์Šต๋‹ˆ๋‹ค.
๋””๋ฒ„๊ทธ: xhr ํด๋ง ์ˆ˜์‹  ๋ฐ์ดํ„ฐ ํŒจํ‚ท 5:::{"name":"login","args":[{"uname":"gjjn","pwd":"3f01728152a0225ff9806c401ffdbe77"}]}
๋””๋ฒ„๊ทธ: ํด๋ง ์‹œ๊ฐ„ ์ดˆ๊ณผ ์ง€์šฐ๊ธฐ
๋””๋ฒ„๊ทธ: xhr ํด๋ง ์“ฐ๊ธฐ 5:::{"name":"l_msg","args":[{"uname":"gjjn","type":true,"head":" http://42.121. 14.234/์ •์˜๋˜์ง€ ์•Š์Œ "}]}
๋””๋ฒ„๊ทธ: ํด๋ผ์ด์–ธํŠธ 11012331592122282453์— ๋Œ€ํ•œ ๋‹ซ๊ธฐ ์‹œ๊ฐ„ ์ดˆ๊ณผ ์„ค์ •
๋””๋ฒ„๊ทธ: xhr-polling ์ˆ˜์‹  ๋ฐ์ดํ„ฐ ํŒจํ‚ท 5:::{"name":"loginout"}
๋””๋ฒ„๊ทธ: websocket ์“ฐ๊ธฐ 5:::{"name":"l_msg","args":[{"uname":"gregergre","type":true,"head":" http://42.121.14.234/ ์ •์˜๋˜์ง€ ์•Š์€ "}]}
๋””๋ฒ„๊ทธ: ํด๋ผ์ด์–ธํŠธ 5207531891749391108์— ๋Œ€ํ•œ ํ•˜ํŠธ๋น„ํŠธ ๋ฐฉ์ถœ
๋””๋ฒ„๊ทธ: websocket ์“ฐ๊ธฐ 2::
๋””๋ฒ„๊ทธ: ํด๋ผ์ด์–ธํŠธ 5207531891749391108์— ๋Œ€ํ•œ ํ•˜ํŠธ๋น„ํŠธ ์‹œ๊ฐ„ ์ดˆ๊ณผ ์„ค์ •
๋””๋ฒ„๊ทธ: ํ•˜ํŠธ๋น„ํŠธ ํŒจํ‚ท์„ ๋ฐ›์•˜์Šต๋‹ˆ๋‹ค.
๋””๋ฒ„๊ทธ: ํด๋ผ์ด์–ธํŠธ 5207531891749391108์— ๋Œ€ํ•œ ํ•˜ํŠธ๋น„ํŠธ ์‹œ๊ฐ„ ์ดˆ๊ณผ๊ฐ€ ์ง€์›Œ์กŒ์Šต๋‹ˆ๋‹ค.
๋””๋ฒ„๊ทธ: ํด๋ผ์ด์–ธํŠธ 5207531891749391108์— ๋Œ€ํ•œ ํ•˜ํŠธ๋น„ํŠธ ๊ฐ„๊ฒฉ ์„ค์ •
๋””๋ฒ„๊ทธ: websocket ์“ฐ๊ธฐ 5:::{"name":"loginout","args":[{}]}

xhr-polling์ด ๋ฐ์ดํ„ฐ ํŒจํ‚ท 5:::{"name":"loginout"}๋ฅผ ์ˆ˜์‹ ํ–ˆ์Šต๋‹ˆ๋‹ค.
๊ทธ๋Ÿฌ๋‚˜ ๊ฒฐ๊ณผ๋Š” ์•„๋‹™๋‹ˆ๋‹ค.

์—ฌ๊ธฐ๋„ ๋งˆ์ฐฌ๊ฐ€์ง€์ž…๋‹ˆ๋‹ค. ๋™์ผํ•œ ์ฝ”๋“œ๋ฅผ ์‚ฌ์šฉํ–ˆ์ง€๋งŒ Chrome MacOS์—์„œ๋Š” ์ž‘๋™ํ•˜์ง€๋งŒ Chrome Windows์—์„œ๋Š” ์ž‘๋™ํ•˜์ง€ ์•Š์Šต๋‹ˆ๋‹ค.

๋ฒˆ์‹ ๋ฐฉ๋ฒ• - https://gist.github.com/jonnsl/5021596

+1, ์ด ๋ฌธ์ œ๋ฅผ ํ•ด๊ฒฐํ•˜์‹ญ์‹œ์˜ค.. @LearnBoost

๋‚˜๋Š” ์ด๊ฒƒ์„๋ณด๊ณ  ์žˆ์ง€๋งŒ ๋‚ด ๊ฒฐ๊ตญ์—๋Š” Websocket ์—ฐ๊ฒฐ๊ณผ SOCKET.io ์„œ๋ฒ„๋กœ ๋ณด๋‚ด์ง„ ๋ฐ˜๋ณต๋˜๋Š” XHR ์š”์ฒญ์œผ๋กœ ๋ด…๋‹ˆ๋‹ค.

์›น ์†Œ์ผ“ ์—ฐ๊ฒฐ์ด ์„ฑ๊ณตํ•œ ๊ฒƒ์ฒ˜๋Ÿผ ๋ณด์ด์ง€๋งŒ XHR ์š”์ฒญ์ด ํ‘œ์‹œ๋ฉ๋‹ˆ๋‹ค.

Request URL:ws://localhost:5000/socket.io/?EIO=2&transport=websocket&sid=XcMblHoZ0x97QRn_AAAE
Request Method:GET
Status Code:101 Switching Protocols
Request Headers CAUTION: Provisional headers are shown.
Cache-Control:no-cache
Connection:Upgrade
Cookie:io=XcMblHoZ0x97QRn_AAAE
Host:localhost:5000
Origin:http://localhost:3000
Pragma:no-cache
Sec-WebSocket-Extensions:permessage-deflate; client_max_window_bits, x-webkit-deflate-frame
Sec-WebSocket-Key:EZixwYoUHpFFpgrEOqiS+w==
Sec-WebSocket-Version:13
Upgrade:websocket
User-Agent:Mozilla/5.0 (Macintosh; Intel Mac OS X 10_9_4) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/35.0.1916.153 Safari/537.36
Query String Parametersview sourceview URL encoded
EIO:2
transport:websocket
sid:XcMblHoZ0x97QRn_AAAE
Response Headers
Connection:Upgrade
Sec-WebSocket-Accept:WHsiBZoW9stmULt+YX8wmNK1wx8=
Upgrade:websocket

์›น ์†Œ์ผ“ ํ”„๋ ˆ์ž„์˜ ๋ชจ์–‘์€ ๋‹ค์Œ๊ณผ ๊ฐ™์Šต๋‹ˆ๋‹ค.
https://www.dropbox.com/s/v6szg9hka53erbc/Screenshot%202014-07-09%2011.12.33.png

๊ทธ๋ฆฌ๊ณ  ๊ธด ํด๋ง ์š”์ฒญ

https://www.dropbox.com/s/pf7d56tp85864bg/Screenshot%202014-07-09%2011.15.47.png

Google Chrome 35.0.1916.153์—์„œ ์‹คํ–‰ ์ค‘์ž…๋‹ˆ๋‹ค.

์†Œ์ผ“ ๋ฌธ์ œ ๋ฒ„์ „์€ [email protected]

๊ฐ™์€ ๋ฌธ์ œ๊ฐ€ ์žˆ์Šต๋‹ˆ๋‹ค. ์—…๋ฐ์ดํŠธ๊ฐ€ ์žˆ์Šต๋‹ˆ๊นŒ? SocketIO 1.0.6 ์‚ฌ์šฉ

์ฒซ ๋ฒˆ์งธ ์š”์ฒญ์€ ํ•ญ์ƒ XHR์ด๊ณ , ๊ทธ๋Ÿฐ ๋‹ค์Œ (๊ฐ€๋Šฅํ•œ ๊ฒฝ์šฐ) WebSocket์œผ๋กœ _์—…๊ทธ๋ ˆ์ด๋“œ_ํ•ฉ๋‹ˆ๋‹ค. ํ›„์† ํด๋ง์ด ์ค‘๋‹จ๋จ(๊ฒฝ์šฐ์— ๋”ฐ๋ผ ์ถ”๊ฐ€ ํด๋ง ์ฃผ๊ธฐ๊ฐ€ ์žˆ์„ ์ˆ˜ ์žˆ์ง€๋งŒ 1์„ ๋„˜์ง€ ์•Š์Œ)

@guille ๋‚ด๊ฐ€ ํ™•์ธํ•œ ๊ฒƒ์€

์•ˆ๋…•,

์ด ๋ฌธ์ œ๋ฅผ ํ•ด๊ฒฐํ•˜๊ธฐ ์œ„ํ•œ ํ•ด๊ฒฐ์ฑ…์€ ๋ฌด์—‡์ž…๋‹ˆ๊นŒ?

@rohittailor : ํด๋ผ์ด์–ธํŠธ์—์„œ ์ด๊ฒƒ์„ ํ…Œ์ŠคํŠธํ•˜๊ณ  ์žˆ์Šต๋‹ˆ๋‹ค.

    <script src="/socket.io/socket.io.js"></script>
    <script>
        var socket = io.connect({transports: ['websocket']});
    </script>

๊ทธ๋ฆฌ๊ณ  ์ง€๊ธˆ๊นŒ์ง€ ๋„ˆ๋ฌด ์ข‹์Šต๋‹ˆ๋‹ค. XHR ์—ฐ๊ฒฐ์„ ์™„์ „ํžˆ ํ”ผํ•˜๊ณ  ์žˆ์Šต๋‹ˆ๋‹ค.

์ด๊ฒƒ์€ ๋‚ด ๋ฌธ์ œ๋„ ํ•ด๊ฒฐํ•˜๊ณ  websocket์€ ์ž˜ ์ž‘๋™ํ–ˆ์ง€๋งŒ ๋”๋Ÿฌ์šด XHR ํด๋ง๋„์žˆ์—ˆ์Šต๋‹ˆ๋‹ค. @gonzalodiaz ๊ฐ์‚ฌ

WS๋กœ ์„ฑ๊ณต์ ์œผ๋กœ ์—…๊ทธ๋ ˆ์ด๋“œํ•˜์ง€๋งŒ Web Inspector์—์„œ XHR ํด๋ง ์ฃผ๊ธฐ๊ฐ€ ๋ฌด๊ธฐํ•œ ๊ณ„์†๋˜๋Š” ์‹œ๋‚˜๋ฆฌ์˜ค๋ฅผ ๋ณด๊ณ  ์‹ถ์Šต๋‹ˆ๋‹ค!

(๋ฐ๋ชจ, ๋น„๋””์˜ค, ์• ๋‹ˆ๋ฉ”์ด์…˜ GIF, ๋ฌด์—‡์ด๋“  ์ž‘๋™)

๋‚ด์ผ MS Azure ํด๋ผ์šฐ๋“œ์—์„œ ํ˜ธ์ŠคํŒ…๋˜๋Š” ๋‚ด ์›น ์‚ฌ์ดํŠธ์— ๋Œ€ํ•œ ๋ฐ๋ชจ ์•ก์„ธ์Šค๋ฅผ ์ œ๊ณตํ•  ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค. ํ…Œ์ŠคํŠธ URL๊ณผ socket.io๊ฐ€ ํ˜ธ์ŠคํŒ…๋˜๋Š” ๋ฐฉ์‹์— ๋Œ€ํ•œ ์ž์„ธํ•œ ์ •๋ณด๋ฅผ ์•Œ๋ ค์ฃผ์‹ค ์ˆ˜ ์žˆ์Šต๋‹ˆ๊นŒ?

@guille ์ด๊ฑด ์–ด๋•Œ

์›น ์†Œ์ผ“ ํ”„๋ ˆ์ž„์˜ ๋ชจ์–‘์€ ๋‹ค์Œ๊ณผ ๊ฐ™์Šต๋‹ˆ๋‹ค.
https://www.dropbox.com/s/v6szg9hka53erbc/Screenshot%202014-07-09%2011.12.33.png

๊ทธ๋ฆฌ๊ณ  ๊ธด ํด๋ง ์š”์ฒญ

https://www.dropbox.com/s/pf7d56tp85864bg/Screenshot%202014-07-09%2011.15.47.png

๊ทธ๊ฒƒ๋“ค์€ ๋ฌดํ•œ์ • ๊ณ„์†๋ฉ๋‹ˆ๊นŒ? ์— ์ค‘๋ณต ํ”„๋ ˆ์ž„์ด ์žˆ์Šต๋‹ˆ๊นŒ?
์‘๋‹ต? DEBUG=*์™€ ํ•จ๊ป˜ ํ•ด๋‹น ์„œ๋ฒ„ ๋กœ๊ทธ๋ฅผ ๊ฒŒ์‹œํ•  ์ˆ˜ ์žˆ์Šต๋‹ˆ๊นŒ?
์ด ์ƒํ™ฉ์ด ๋ฐœ์ƒํ•˜๋ฉด localStorage.debug='*' ์™€ ํ•จ๊ป˜ ๋ธŒ๋ผ์šฐ์ € ๋กœ๊ทธ๊ฐ€ ๋ฐœ์ƒํ•ฉ๋‹ˆ๊นŒ?

โ€”
๊ธฐ์˜ˆ๋ฅด๋ชจ ๋ผ์šฐํ โ€“ @rauchg https://twitter.com/rauchg

2014๋…„ 10์›” 14์ผ ํ™”์š”์ผ ์˜คํ›„ 10์‹œ 59๋ถ„, Viren Negi [email protected]
์ผ๋‹ค:

@guille https://github.com/guille ์ด๊ฑด ์–ด๋•Œ

์›น ์†Œ์ผ“ ํ”„๋ ˆ์ž„์˜ ๋ชจ์–‘์€ ๋‹ค์Œ๊ณผ ๊ฐ™์Šต๋‹ˆ๋‹ค.

https://www.dropbox.com/s/v6szg9hka53erbc/Screenshot%202014-07-09%2011.12.33.png

๊ทธ๋ฆฌ๊ณ  ๊ธด ํด๋ง ์š”์ฒญ

https://www.dropbox.com/s/pf7d56tp85864bg/Screenshot%202014-07-09%2011.15.47.png

โ€”
์ด ์ด๋ฉ”์ผ์— ์ง์ ‘ ๋‹ต์žฅํ•˜๊ฑฐ๋‚˜ GitHub์—์„œ ํ™•์ธํ•˜์„ธ์š”.
https://github.com/Automattic/socket.io/issues/991#issuecomment -59161273
.

@guille ๋‚˜๋Š” xhr ์‘๋‹ต์ด ๋ฌดํ•œ์ • ๋ฐ˜๋ณต๋˜๋Š” ๊ฒƒ์„ ๋ด…๋‹ˆ๋‹ค. ๋ณต์ œ ํ”„๋ ˆ์ž„์— ๋Œ€ํ•ด ํ™•์‹ ์ด

๋‚ด๊ฐ€ ์–ผ๋งˆ๋‚˜ ๋„์›€์ด ๋  ์ˆ˜ ์žˆ์„์ง€๋Š” ๋ชจ๋ฅด๊ฒ ์ง€๋งŒ ์›น ์†Œ์ผ“์ด ์•ˆ์ „ํ•œ ๊ฒฝ์šฐ์—๋งŒ ์—ฐ๊ฒฐํ•  ์ˆ˜ ์žˆ๋‹ค๋Š” ๊ฒƒ์„ ์•Œ๊ฒŒ ๋˜์—ˆ์Šต๋‹ˆ๋‹ค. ๋ณด์•ˆ๋˜์ง€ ์•Š์€ WebSocket ์—ฐ๊ฒฐ์„ ํ—ˆ์šฉํ•˜๊ธฐ ์œ„ํ•ด ํ—ค๋”(CORS์™€ ๊ฐ™์€)๊ฐ€ ํ•„์š”ํ•œ ์ตœ๊ทผ ๋ณด์•ˆ ๋ณ€๊ฒฝ ์‚ฌํ•ญ์ด ์žˆ์Šต๋‹ˆ๊นŒ?

WebSockets๋Š” ํ•œ ๋‹ฌ ์ „์— ์ €๋ฅผ ์œ„ํ•ด ์ผํ–ˆ์ง€๋งŒ ์ด์ œ๋Š” wss:// ์—ฐ๊ฒฐ์—์„œ๋งŒ ์ž‘๋™ํ•ฉ๋‹ˆ๋‹ค.
ํฌ๋กฌ 38.0.2125.104 - ์œˆ๋„์šฐ 8.1.1

ํŽธ์ง‘: ์ด ๊ฒฐ๊ณผ๋Š” ์‹ค์ œ๋กœ http://www.websocket.org/echo.html ์˜ ๋ฌธ์ œ์ผ ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค
๋‹ค๋ฅธ ๊ณณ์—์„œ ํ…Œ์ŠคํŠธ๋ฅผ ํ•  ์ˆ˜ ์—†์—ˆ์Šต๋‹ˆ๋‹ค

WS ์—ฐ๊ฒฐ์˜ ์„ฑ๊ณต์€ ์‹ค์ œ๋กœ ๋„คํŠธ์›Œํฌ/์„œ๋ฒ„ ๊ธฐ๋Šฅ์— ๋‹ฌ๋ ค ์žˆ์Šต๋‹ˆ๋‹ค. SSL์€ ๋ฐ์ดํ„ฐ๊ฐ€ ํ•ด๋…๋˜๊ธฐ ์ „์— ๋ฐ์ดํ„ฐ๋ฅผ ์†์ƒ์‹œํ‚ฌ ์ˆ˜ ์—†์Œ์„ ๋ณด์žฅํ•ฉ๋‹ˆ๋‹ค(ํ›„์† ํ”„๋ก์‹œ/๋กœ๋“œ ๋ฐธ๋Ÿฐ์„œ๋Š” ์—ฌ์ „ํžˆ ์†์ƒ๋  ์ˆ˜ ์žˆ์Œ).

๋‚˜๋Š” ๊ทธ๊ฒƒ์ด ์‹ค์ œ๋กœ ์ฝ”๋“œ์˜ ๋ฒ„๊ทธ๋ผ๋Š” ๊ฒƒ์„ ์•Œ์•„์ฐจ๋ ธ๊ณ , WS ์—ฐ๊ฒฐ์„ ํด๋งํ•˜์ง€๋„ ์•Š์•˜๊ณ , ๋ณ€๊ฒฝ์„ ํ•œ ๋‹ค์Œ ์ž‘๋™ํ–ˆ์Šต๋‹ˆ๋‹ค. ๊ธฐ์–ต๋‚˜๋ฉด ์˜ค๋Š˜ ๋ฐค ์ˆ˜์ •๋œ ์†Œ์Šค๋ฅผ ์‚ดํŽด๋ณด๊ฒ ์Šต๋‹ˆ๋‹ค.

๊ทธ๋Ÿฌ๋‚˜ ๋‹ค๋ฅธ ๋ชจ๋“  ์‚ฌ๋žŒ์—๊ฒŒ ์ž‘๋™ํ•˜๋Š” ๊ฒฝ์šฐ ๋‚ด ์„ค์ •์— ์ž˜๋ชป๋œ ๋‹ค๋ฅธ ๊ฒƒ์ผ ์ˆ˜ ์žˆ์ง€๋งŒ ์‹œ๋„ํ•˜์ง€ ์•Š๊ณ  WS๋ฅผ ์‚ฌ์šฉํ•  ์ˆ˜ ์—†๋‹ค๊ณ  ์ƒ๊ฐํ•˜์—ฌ ์—ฐ๊ฒฐ์„ ์‹œ๋„ํ•˜์ง€ ์•Š์•˜์Šต๋‹ˆ๋‹ค. &&๋ฅผ || ๊ณ ์ณค๋‹ค.

๋” ๋“ฃ๊ณ  ์‹ถ์–ด์š”!

์—ฌ์ „ํžˆ (์ž‘์€) ๋ฌธ์ œ์ด์ง€๋งŒ ํด๋ผ์ด์–ธํŠธ๋Š” ๋‹ค๋ฅธ ์ „์†ก์„ ์‹œ๋„ํ•˜๋Š” ๋Œ€์‹  ํ•ญ์ƒ ํด๋ง ์š”์ฒญ์„ ํ•ฉ๋‹ˆ๋‹ค. ์ง€์ •ํ•ด์•ผ ํ•ฉ๋‹ˆ๋‹ค

{transports: ['websocket']}

์ž‘๋™์‹œํ‚ค๋ ค๋ฉด ํด๋ผ์ด์–ธํŠธ๊ฐ€ ๋ชจ๋“  ์ „์†ก์„ ์‹œ๋„ํ•˜์—ฌ ์ข‹์€ ์ „์†ก์„ ์ฐพ์•„์•ผ ํ•ฉ๋‹ˆ๋‹ค. ๊ทธ๋ ‡์ฃ ?

์ด ๋ฌธ์ œ๋Š” ์ œ๊ฐ€ 2012/13๋…„์— "์ˆœ์ˆ˜ํ•œ" ์›น ์†Œ์ผ“ ํŒจํ‚ค์ง€ ์ž‘์—…์„ ์‹œ์ž‘ํ•œ ์ด์œ ์˜€์Šต๋‹ˆ๋‹ค.

์ด ๋ฌธ์ œ๊ฐ€ ํ•ด๊ฒฐ๋˜์—ˆ์Šต๋‹ˆ๊นŒ? ๋น„์Šทํ•œ ๊ฒƒ์„ ๋ณด๊ณ  ์žˆ์ง€๋งŒ ๊นŠ์ด ํŒŒ๊ณ  ๋“ค๊ธฐ ์ „์— ๋น ๋ฅธ ๊ฒ€์ƒ‰์„ ํ•˜๊ณ  ์‹ถ์—ˆ์Šต๋‹ˆ๋‹ค... ๋Œ“๊ธ€?

์ด ๋ฌธ์ œ์— ๋Œ€ํ•ด ๋งˆ์ง€๋ง‰์œผ๋กœ ์–ธ๊ธ‰ํ•œ ์ดํ›„๋กœ ์ฝ”๋“œ๊ฐ€ ์ƒ๋‹นํžˆ ๋ณ€๊ฒฝ๋˜์—ˆ์Šต๋‹ˆ๋‹ค. ๊ฐ™์€ ๋ฒ„๊ทธ์ผ ๊ฐ€๋Šฅ์„ฑ์€ ๊ฑฐ์˜ ์—†์Šต๋‹ˆ๋‹ค. ์ง€๋‚œ๋ฒˆ์— ๋ฌธ์ œ๋ฅผ ์ผ์œผํ‚จ ๊ฒƒ์œผ๋กœ ์˜์‹ฌ๋˜๋Š” ํšŒ์„ ์„ ์ฐพ์„ ์ˆ˜ ์—†๋Š” ๊ฒƒ ๊ฐ™์Šต๋‹ˆ๋‹ค. ๊ทธ๋ ‡๋‹ค๊ณ  ๊ณ ์ •์ด ๋˜๋Š” ๊ฒƒ์€ ์•„๋‹™๋‹ˆ๋‹ค.

๋‚ด socket.io ์ฝ”๋“œ๋Š” ํ˜„์žฌ bug engine.io-client์— ์˜ํ•ด ์ฐจ๋‹จ๋˜์–ด ์žˆ์œผ๋ฏ€๋กœ ๋ช‡ ๋‹ฌ ๋™์•ˆ s.io๋ฅผ ์‚ฌ์šฉํ•˜์ง€ ์•Š์•˜์œผ๋ฏ€๋กœ ์ด๊ฒƒ์ด ์—ฌ์ „ํžˆ ๋ฌธ์ œ์ธ์ง€ ํ™•์‹คํ•˜๊ฒŒ ๋งํ•  ์ˆ˜ ์—†์Šต๋‹ˆ๋‹ค.

@nevercast ws๊ฐ€ ์ž‘๋™ํ•˜๋Š” ๊ฒƒ์— ๋Œ€ํ•œ ๊ท€ํ•˜์˜ ์˜๊ฒฌ์ด์ง€๋งŒ ws not์€ ์ œ ๊ฒฝ์šฐ์—๋Š” ์™„์ „ํžˆ ์˜ณ์ง€ ์•Š์•˜์Šต๋‹ˆ๋‹ค. ์ง€์ ํ•ด ์ฃผ์…”์„œ ๊ฐ์‚ฌํ•ฉ๋‹ˆ๋‹ค. ์ผ์ฃผ์ผ ๋„˜๊ฒŒ ์ด ๋ฌธ์ œ๋ฅผ ์ฐพ๊ณ  ์žˆ์—ˆ์Šต๋‹ˆ๋‹ค. ์–ด๋–ป๊ฒŒ ๋“  ๋‚ด ๋„คํŠธ์›Œํฌ์˜ ๋ชจ๋“  ws ์—ฐ๊ฒฐ์ด ์ฐจ๋‹จ๋˜์—ˆ์ง€๋งŒ wss๊ฐ€ ์ œ๋Œ€๋กœ ์ž‘๋™ํ–ˆ์Œ์„ ๋ฐœ๊ฒฌํ–ˆ์Šต๋‹ˆ๋‹ค.

์ด ์›น์‚ฌ์ดํŠธ๋Š” ํ›Œ๋ฅญํ•ฉ๋‹ˆ๋‹ค: http://websocketstest.com/ ์–ด๋–ค ํฌํŠธ๊ฐ€ ์ฃผ์–ด์ง„ ๋„คํŠธ์›Œํฌ์—์„œ ์›น ์†Œ์ผ“์„ ์‹คํ–‰ํ•  ์ˆ˜ ์žˆ๋Š”์ง€ ์•Œ๋ ค์ค๋‹ˆ๋‹ค. ์›น ์†Œ์ผ“ ๋””๋ฒ„๊น…์— ๋„ˆ๋ฌด ๊ด€์—ฌํ•˜๊ธฐ ์ „์— ์ด๊ฒƒ์„ ํ™•์ธํ•˜๋Š” ๊ฒƒ์ด ์ข‹์Šต๋‹ˆ๋‹ค.

์†Œ์ผ“ io์— ๋ฌธ์ œ๊ฐ€ ์žˆ์ง€๋งŒ ์–ด๋””๊ฐ€ ์ž˜๋ชป๋˜์—ˆ๋Š”์ง€ ์ž˜ ๋ชจ๋ฅด๊ฒ ์Šต๋‹ˆ๋‹ค.
image

์œ„์˜ ์ด๋ฏธ์ง€๋Š” ๋กœ์ปฌ์—์„œ๋Š” ์ž˜ ๋˜๋Š” ๊ฒƒ์„ ๋ณด์—ฌ์ฃผ์ง€๋งŒ ์•„๋ž˜ ์ด๋ฏธ์ง€๋Š” AWS ํ™˜๊ฒฝ์—์„œ ์‹œ๋„ํ•˜๋‹ค๊ฐ€ ์บก์ณํ•œ ๊ฒƒ์ž…๋‹ˆ๋‹ค.

image

์†Œ์ผ“ io์— ๋ฌธ์ œ๊ฐ€ ์žˆ์ง€๋งŒ ์–ด๋””๊ฐ€ ์ž˜๋ชป๋˜์—ˆ๋Š”์ง€ ์ž˜ ๋ชจ๋ฅด๊ฒ ์Šต๋‹ˆ๋‹ค.
image

์œ„์˜ ์ด๋ฏธ์ง€๋Š” ๋กœ์ปฌ์—์„œ๋Š” ์ž˜ ๋˜๋Š” ๊ฒƒ์„ ๋ณด์—ฌ์ฃผ์ง€๋งŒ ์•„๋ž˜ ์ด๋ฏธ์ง€๋Š” AWS ํ™˜๊ฒฝ์—์„œ ์‹œ๋„ํ•˜๋‹ค๊ฐ€ ์บก์ณํ•œ ๊ฒƒ์ž…๋‹ˆ๋‹ค.

image

๊ฐ™์€ ๋ฌธ์ œ์— ์ง๋ฉด

์ด ํŽ˜์ด์ง€๊ฐ€ ๋„์›€์ด ๋˜์—ˆ๋‚˜์š”?
0 / 5 - 0 ๋“ฑ๊ธ‰