Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Sign up for free
Menu
Search
Features
All features
Private URLs
Password Protection
Custom URLS
Scheduled publishing
Remove Branding
Restrict embedding
Deck Collections
Notes
Features
All features
Private URLs
Password Protection
Custom URLS
Scheduled publishing
Remove Branding
Restrict embedding
Deck Collections
Notes
Explore
Featured decks
Featured speakers
Programming
Technology
Storyboards
Explore
Featured decks
Featured speakers
Programming
Technology
Storyboards
Pricing
Search
Sign in
Sign up for free
WebSocket, Socket.io
Search
Sponsored
·
Ship Features Fearlessly
Turn features on and off without deploys. Used by thousands of Ruby developers.
→
Teddy
August 07, 2018
Programming
67
1
Share
Embed
Copy iframe code
Copy JS code
Copy link
Start on current slide
WebSocket, Socket.io
Teddy
August 07, 2018
More Decks by Teddy
See All by Teddy
스타트업 개발자의 이야기 (국민대)
teddykims
1
110
개발자의 인공지능 뽀개기
teddykims
0
170
Git 기초
teddykims
0
99
클라이언트 권한 부여, 인증 시스템, OAuth-JWT
teddykims
0
120
2018.06, 싸이그래머 '심리상담과 IT'
teddykims
0
120
2018.05, 소물, '소프트웨어와 미래 기술'
teddykims
0
86
소프트웨어와 미래 기술 (Software, Future Tech)
teddykims
0
200
리눅스 메모리 보호기법, 보안시스템의 이해
teddykims
0
250
무선 네트워크 해킹과 보안 (Network Hacking)
teddykims
0
240
Other Decks in Programming
See All in Programming
re:Inventに行く前に知っておきたい現地参加のノウハウ
nokomoro3
0
430
R8 の設定見直しでアプリサイズ削減
andpad
0
220
ハーネス設計入門 〜 基礎知識の整理から実務へのステップアップ 〜
kinopeee
28
32k
AIで開発が速くなった先で、開発チームは何を目指すか
shihochan
0
1.3k
Optunaを作ったときにやりたかったこと、その後 (2026/10/16, Optuna Meetup #3)
iwiwi
1
430
Railsのためのパスキー実践入門 〜マルチテナントSaaSでの意思決定〜
utakaha
2
560
AI主導のプログラミング学習アプリを作ってみた
econanringo
0
180
Everything will be SERVERLESS — 信じて運用した10年の経験値 / Everything Will be Serverless — Lessons Learned from 10 Years of Operational Experience
seike460
PRO
1
1.1k
現場と育てるRailsモデリング 〜Spreadsheetから始めたモデル設計〜
siroemk
2
590
C#の現在地 進化の歴史と、AI時代の.NET Everywhere
neuecc
5
5.2k
Apple Intelligence を用いた個人情報誤送信防止、及びユーザーリクエスト体験の改善について
yukiny
0
350
When benchmarks go bad - what I learned from measuring performance wrong
hollycummins
0
220
Featured
See All Featured
Design and Strategy: How to Deal with People Who Don’t "Get" Design
morganepeng
133
20k
Bootstrapping a Software Product
garrettdimon
PRO
306
120k
Side Projects
sachag
456
43k
The B2B funnel & how to create a winning content strategy
katarinadahlin
PRO
1
570
How to Create Impact in a Changing Tech Landscape [PerfNow 2023]
tammyeverts
56
3.5k
AI in Enterprises - Java and Open Source to the Rescue
ivargrimstad
0
1.5k
Leo the Paperboy
mayatellez
10
2.4k
職位にかかわらず全員がリーダーシップを発揮するチーム作り / Building a team where everyone can demonstrate leadership regardless of position
madoxten
69
67k
Gemini Prompt Engineering: Practical Techniques for Tangible AI Outcomes
mfonobong
2
590
<Decoding/> the Language of Devs - We Love SEO 2024
nikkihalliwell
1
360
Build your cross-platform service in a week with App Engine
jlugia
234
19k
Digital Projects Gone Horribly Wrong (And the UX Pros Who Still Save the Day) - Dean Schuster
uxyall
1
3.4k
Transcript
Socket.io ӒܻҊ HTTP … WebSocket !1
Socket.io • 2010֙ ӝઓ HTTP োѾ ݆ ޙઁਸ ೧ѾೞҊ ࢤ.
(ଵҊ: http://jokerpack.blog.me/70184017711) • Node.js (JavaScript) ӝ߈ਵ۽ पदр HTTP ࢲߡܳ ѐߊ ೡ ࣻ ח য়ࣗझ ۄ ࠳۞ܻ. • WebSocket, FlashSocket, AJAX Long Polling, AJAX Multi part Streaming, IFrame, JSONP Polling ਸ ೞա API ۽ ୶࢚ച. !2
Why Socket.io? • JavaScript ۽ Node.js ਤীࢲ ೣԋ ֥ ࣻ
! • ѐߊо п ӝࣿਸ Ө ೧ೞ ޅೞѢա ҳഅ ߑߨਸ ੜ ঌ ޅ೧ب ࢎਊೡ ࣻ ѱՔ ѐߊغয ୡӝ ѐߊ द ࠺ૉפझ ۽ী݅ ೡ ࣻ . • জ ۄܳ ನೣೞৈ, ࠳ۄ৬ ਢ ࢲߡ ઙܨ৬ ߡਸ ঈೞৈ о ೠ ాन ߑधਸ ঈೞৈ োѾਸ ೧ӝী ҳഋ HTTP োѾب ਗਸ ೡ ࣻ . !3
HTTP • HTTP ח <ۄীࢲ ࢲߡ۽> ױߑೱ ాनਸ ݾਵ۽
ࢤ೮. • TCP/IP ҅க ਤী ઓೞח HTTP ী ӝ߈ೠ ਢ ాन ࠺োѾ ೱ ࢿѺਸ о Ҋ . ۄח ࢲߡ۽ ਃ(Request)ਸ ೞҊ ࢲߡח ী (Response) ਸ ೞҊ റ োѾ ײ൦. • ۽ష ౠࢿ࢚ (1) ࢲߡо ۄ۽ ؘఠܳ ח Ѫ (2) पदрਵ۽ ؘఠܳ Ҋ ߉ח Ѫী ೠ҅о . ಞߨਸ ࢎਊೞ؊ۄب Header, Body ؘఠী ݆ য়ߡ ٘о ߊࢤ೮. • ࢲߡ৬ ࣘੋ োѾਸ ೞӝ ਤ೧ աৡ ৈ۞о ಞߨ = Comet (ۄ ݺदੋ ਃ হ ࢲߡীࢲ ۄ۽ ؘఠܳ ࠁղח ۽Ӓې߁ ಁఢ, ݽ؛) !4
COMET • Polling (ಫ݂) • ۄо HTTP Request ܳ ҅ࣘ
ਃ೧ ߮ ղਊਸ ׳߉Ҋ সؘܳ ੌ ӝ۽ ߈ࠂೞח ߑध • ӝо ૣਵݶ ࢲߡ ࢿמী ࠗ оҊ, ӝо ӡݶ पदр ࢿמ ডр ڄযח ޙ ઁо . • ҳഅ ӭՔೞ ޅೞҊ, խ࠺о बೞ. !5
COMET !6
COMET • Long-Polling (܄-ಫ݂) • ੌױ ۄо HTTP Request ܳ
ਃ ೠ. ࢚క۽ ҅ࣘ ӝܻо ࢲߡীࢲ ߸҃ ղਊ ࢤӝח ࣽр (׳ೡ ߮о ࢤӡ ٸ) ೧ ۄ۽ Ӓ ࣽр Response ܳ ׳ೞݴ োѾ ઙܐػ. ӒܻҊ ҍ߄۽ ۄীࢲ द HTTP Request Api ܳ զ۰ ࢲߡ ߮ܳ ӝܻѱ غח ߑध. • पदр ݫद ׳ ਃೞ݅ ࢲߡ ࢚క ߸҃ ࠼ߣ ߊࢤೞח ঋח ࢲ࠺झী ೞ. • Polling/Long Polling ࠼ب بী ରо ਸ ࡺ, োѾ ࣘࢿ হח HTTP ۽ पदрࢿਸ ഛࠁೞӝ ਤ೧ ۄо ࢲߡী ҅ࣘ ࢜۽ HTTP োѾਸ ࢤࢿೞחؘ, ח Ԩ ݆ য়ߡ٘ܳ ਬߊೠ. • ҳഅ ӭՔೞ ޅೞҊ, խ࠺о बೞ. !7
COMET !8
COMET • Streaming (झܻ߁) • Long Polling җ ݃ଲо۽ ۄীࢲ
ࢲߡ۽ ੌױ HTTP Request ܳ զܽ. ࢲߡীࢲ ۄ۽ ߮ܳ ׳ೡ ٸ ೧ ਃਸ Ր ঋҊ ਃೠ ݫद݅ ࠁղ ӝܳ ߈ࠂೞח ߑध. Long Polling ী ࠺೧ ࢲߡীࢲ ݫदܳ ࠁղҊب द HTTP Request োѾਸ ೞ ঋইب غয ࠗ ҃хؼѪਵ۽ ࠁੋ. • োѾਸ ӡѱ ݛҊ ח ҃ী ೠ ҙܻо ࠂೞҊ য۵. • ҳഅ ӭՔೞ ޅೞҊ, խ࠺о बೞ. !9
COMET !10
Traffic Channel • NameSpace (࠙ܨ) • Room (࠙ܨ, օ) •
User (Session ID, ѐੋ) !11 WebSocket • ਢ ࢲߡ৬ ਢ ࠳ۄ р पदр ాनਸ ਤೠ নߑೱ ాनਊ ӝࣿ ӏѺ, ӝઓ HTTP ӝ߈ ױߊࢿ ো Ѿٜ ޙઁܳ ೧Ѿೞӝ ਤ೧ HTML5 ળ ੌࠗ۽ ١ೠ ࣛܖ࣌. • 2008֙ 6ਘ, TCP ӝ߈ ࣗ API ܳ ೡ ݾਵ۽ HTML5 ীࢲ TCPConnection ਵ۽ ѐߊ غ. 2011֙ IETFী ೧ RFC 6455۽ ળചغਵݴ ਢ IDL ਢࣗ APIח W3Cী ೧ ળചغҊ . • ӝઓ ੌ߈ TCP Socket җ ܲ ୭ୡ ࣘ ੌ߈ HTTP Request HandShaking җ (Protocol Overhead) ਸ ా೧ ܖয ח . ӝઓ 80, 443 ನ۽ ࣘਸ ೞ۽ ୶о۽ ߑച߷ ࢸ হ নߑೱ ాन оמೞҊ, HTTP ӏѺੋ CORS ਊա ੋૐ ١ җਸ ӝઓҗ زੌೞѱ оઉт ࣻ ח Ѫ . ߹ب ؊ ١ਵ۽ ֤ܻੋ ؘఠ ܴ ױਤܳ ਊೞৈ ৈ۞ ѐ ழ֏࣌ਸ ݛח ബҗܳ ղח ߑध. • ࠛਃೠ Header ؘఠܳ Ҋ߉ ঋਵפ Overhead ب ഛप . ೞ݅ ই ݆ ࠳ۄীࢲ ਗ ࠗೞৈ ࠺ૉפझ ਃҳࢎ೦ਸ 100% दఃӝীח য۰ ࣻ .
Socket.io • 2010֙ ӝઓ HTTP োѾ ݆ ޙઁਸ ೧ѾೞҊ ࢤ.
(ଵҊ: http://jokerpack.blog.me/70184017711) • Node.js (JavaScript) ӝ߈ਵ۽ पदр HTTP ࢲߡܳ ѐߊ ೡ ࣻ ח য়ࣗझ ۄ ࠳۞ܻ. • WebSocket, FlashSocket, AJAX Long Polling, AJAX Multi part Streaming, IFrame, JSONP Polling ਸ ೞա API ۽ ୶࢚ച. !12
Why Socket.io? • JavaScript ۽ Node.js ਤীࢲ ೣԋ ֥ ࣻ
! • ѐߊо п ӝࣿਸ Ө ೧ೞ ޅೞѢա ҳഅ ߑߨਸ ੜ ঌ ޅ೧ب ࢎਊೡ ࣻ ѱՔ ѐߊغয ୡӝ ѐߊ द ࠺ૉפझ ۽ী݅ ೡ ࣻ . • জ ۄܳ ನೣೞৈ, ࠳ۄ৬ ਢ ࢲߡ ઙܨ৬ ߡਸ ঈೞৈ о ೠ ాन ߑधਸ ঈೞৈ োѾਸ ೧ӝী ҳഋ HTTP োѾب ਗਸ ೡ ࣻ . !13
Connection • Connection • োѾ द HandShake (e.g. TCP
3-way HandShake) җਸ ా೧ Client Session ID, Time-out, Browser ١ ࠁܳ Ҋ ߉Ҋ ࢸਸ ݃ޖܻ ೠ. • Event • Public (नਸ ನೣೠ ݽٚ Client ীѱ) • Broadcasting (नਸ ઁ৻ೞҊ ݽٚ Client ীѱ) • Private (ౠ Client ীѱ) !14
Traffic Channel • NameSpace (࠙ܨ) • Room (࠙ܨ, օ) •
User (Session ID, ѐੋ) <Room1: partnerID/ clientID> - loadMessage - loadOldMessage - updateClientDetail - updatePartnerDetail <Room2: counselingNo> - reloadMessage - reloadMessageAll - messageTyping - messageStopTyping <User: Client ID, Partner ID> - loadCounselingList - loadMessage - loadOldMessage <NameSpace: Client, Partner (Status)> !15
Engine.io • Socket.io ղࠗ ূ, Engine.io • Socket.io о
࠺ૉפझ ਃҳࢎ೦ਸ दఃӝ য۰ Ѣۄח ౸ױೞী ߓನغ. • Connect, Disconnect ١ ӝࠄ Event ঌҊ્ܻ݅ ࢿغয . • WebSocket োѾ ߑध ࢎਊغ ঋਵݴ Polling ١ Comet ాन ߑधਵ۽ ҳࢿ غয . !16
Trouble Shooting ↟ਬোೞޅೠ'BJMPWFSҙܻ ↟যוبӏݽө ↟/PEFKTೠ҅۽-PBE#BMBODJOH١ࢲߡҙܻܳਤ೧ࢲ߹ب݆ӝٜࣿਃ ೧ !17
Trouble Shooting ↟4FTTJPO*%6OLXPO ↟ 1PMMJOHాनߑधೠ҅۽$POOFDUJPOՐযҊোѾغחҗীࢲ4FTTJPO*%ܳযߡܻח ޙઁоߊࢤػ ↟ 8FC4PDLFUਸࢎਊਸъઁೞח҃ҳഋ࠳ۄਗࠛоמ೧য۵ ↟ 4FTTJPO*%6OLXPOޙઁܳ೧Ѿೞӝਤ೧/HJOY4UJDLZ4FTTJPOҗ3FEJTܳبੑೞ݅ҳઑ࢚
೧Ѿয۰ޙઁҊ/HJOY 3FEJTౚगоࢤӟ ↟ ۽झࢲ࠺झౠࢿ࢚ҳഋߡਸࢶਵ۽সਃೞ !18
Trouble Shooting ↟4FTTJPO*%6OLXPO ↟ 1PMMJOHాनߑधೠ҅۽$POOFDUJPOՐযҊোѾغחҗীࢲ4FTTJPO*%ܳযߡܻח ޙઁоߊࢤػ ↟ 8FC4PDLFUਸࢎਊਸъઁೞח҃ҳഋ࠳ۄਗࠛоמ೧য۵ ↟ 4FTTJPO*%6OLXPOޙઁܳ೧Ѿೞӝਤ೧/HJOY4UJDLZ4FTTJPOҗ3FEJTܳبੑೞ݅ҳઑ࢚
೧Ѿয۰ޙઁҊ/HJOY 3FEJTౚगоࢤӟ !19
Trouble Shooting ↟4FTTJPO*%6OLXPO ↟ <Nginx> <Node> 1 Core 8764 <Node>
2 Core 8765 <Node> 3 Core 8766 <Node> 4 Core 8767 <Node> 5 Core 8768 <Node> 6 Core 8769 <Node> 8 Core 8771 <Node> 7 Core 8770 <Redis> Session Store !20
Trouble Shooting ↟4FTTJPO*%6OLXPO ↟ 5SBOTQPSUࢸ ↟ 4XJGU ,PUMJO ٘חܰѷ݅ э۽
↟ !21 var transports = ('WebSocket' in window) ? { transports: ['websocket' ] } : { transports: [‘polling'] }; var connectUrl ='http://localhost:8888'; var socket = io.connect(connectUrl, transports);
)VNBSU$PNQBOZ ӣక