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
·
SiteGround - Reliable hosting with speed, security, and support you can count on.
→
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
月間100万人のサービス刷新で、 技術選定をHonoに振り切った話
yutobara
8
6.6k
個人開発者よ、Honoを使え(おじさんver)
tanahiro2010
2
260
JIS keyboard support in Omarchy
lef237
0
110
設計次第でAIコードの読む量は減らせる / designing-for-code-reading
minodriven
35
17k
sbt 2.0: takeoff
eed3si9n
0
160
パスワード再設定メールのURLについて知っておこう
uyuki234
0
160
phperだってパンチカードでコーディングしたい
o0h
PRO
0
330
GemmaをJevのように使ってみる / Use Gemma like Jev
kishida
5
790
Long Living Tokens, Die, Die, Die! (or: The One Ring is Banned in Modern)
sylph01
0
300
Web Framework Benchmark Battle 2026, Any%
a_matsuda
2
2.1k
Agents on Rails - Rails at Scale 2026
irinanazarova
0
560
Railsのためのパスキー実践入門 〜マルチテナントSaaSでの意思決定〜
utakaha
2
560
Featured
See All Featured
The Anti-SEO Checklist Checklist. Pubcon Cyber Week
ryanjones
0
270
Winning Ecommerce Organic Search in an AI Era - #searchnstuff2025
aleyda
2
2.2k
Facilitating Awesome Meetings
lara
57
7.2k
KATA
mclloyd
PRO
35
16k
JAMstack: Web Apps at Ludicrous Speed - All Things Open 2022
reverentgeek
1
640
The AI Search Optimization Roadmap by Aleyda Solis
aleyda
2
6.3k
Performance Is Good for Brains [We Love Speed 2024]
tammyeverts
12
1.9k
[Rails World 2023 - Day 1 Closing Keynote] - The Magic of Rails
eileencodes
38
3.1k
Abbi's Birthday
coloredviolet
4
10k
Jamie Indigo - Trashchat’s Guide to Black Boxes: Technical SEO Tactics for LLMs
techseoconnect
PRO
0
710
ラッコキーワード サービス紹介資料
rakko
1
5.3M
Dominate Local Search Results - an insider guide to GBP, reviews, and Local SEO
greggifford
PRO
0
370
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 ӣక