Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Speaker Deck
PRO
Sign in
Sign up for free
Socket.IO Introduction
orisano
December 04, 2018
Technology
0
2k
Socket.IO Introduction
orisano
December 04, 2018
Tweet
Share
More Decks by orisano
See All by orisano
OSS Performance Tuning Tips
orisano
8
4.6k
Docker-Compose & BuildKit
orisano
4
640
Container Build Talk
orisano
3
2.1k
dockerignore talk
orisano
2
5.8k
Better docker image+
orisano
6
4.3k
Profiling Go Application
orisano
11
6.5k
Multi-stage Builds Patterns & Practice
orisano
6
4.3k
better docker image
orisano
22
25k
the world of characters
orisano
8
1.2k
Other Decks in Technology
See All in Technology
やってみたLT会 Fleet Managerのススメ
yukiiiiikuma
PRO
0
420
CityGMLとFBXの連携で地理空間のエンタメ化
soh_mitian
0
770
GitOps共有会
johnmanjiro13
0
100
ECS on EC2 で Auto Scaling やってみる!
sayjoy
1
290
ログラスを支える技術的投資の仕組み / loglass-technical-investment
urmot
9
2k
psql, my favorite tool!
nuko_yokohama
1
180
hey BOOK
heyinc
26
290k
Learning to Solve Hard Minimal Problems
takmin
1
530
開発環境のセキュリティおよびCI/CDパイプラインのセキュア化
rung
PRO
13
5.3k
Power Automate for desktopで 配信環境を改善してみた話
akiika
0
340
AWS CLI でやってみる ~ AWS Hands-on for Beginners ECS ハンズオン ~
kentosuzuki
1
560
ここが好きだよAWS管理ポリシー_devio2022/i_am_iam_lover
yukihirochiba
0
3.3k
Featured
See All Featured
A better future with KSS
kneath
226
16k
Music & Morning Musume
bryan
35
4.3k
Building Applications with DynamoDB
mza
84
4.8k
Streamline your AJAX requests with AmplifyJS and jQuery
dougneiner
127
8.5k
Web Components: a chance to create the future
zenorocha
303
40k
Building Your Own Lightsaber
phodgson
95
4.7k
What's new in Ruby 2.0
geeforr
335
30k
Building Flexible Design Systems
yeseniaperezcruz
310
34k
Agile that works and the tools we love
rasmusluckow
319
19k
Designing for humans not robots
tammielis
242
24k
Automating Front-end Workflow
addyosmani
1351
200k
Designing Experiences People Love
moore
130
22k
Transcript
Socket.IOʹೖͨ͠ @orisano
Socket.IOͬͯΔਓ
Socket.IOͬͨ͜ͱ͋Δਓ
Socket.IOΕΔਓ
ΰʔϧ Socket.IO͕ΕΔΑ͏ʹͳΔ
ͦͦSocket.IOͱ
Socket.IO • FEATURING THE FASTEST AND MOST RELIABLE REAL-TIME ENGINE
• ૣͯ͘৴པͰ͖ΔϦΞϧλΠϜΤϯδϯ • ϦΞϧλΠϜͰํͷevent-basedͳ௨৴
Socket.IO • Node.jsͰ࣮͞Ε͍ͯΔ • ࠓversion 2.0 • ϒϥβͰϦΞϧλΠϜ௨৴ͳΒ͜Εͱ͍͏ • ΩϥʔΞϓϦͩͬͨ
Α͋͘Δޡղͱͯ͠ Socket.IO == WebSocket
Socket.IO !== WebSocket
Socket.IO • Ή͠ΖWebSocketͷରԠঢ়گ͕ѱ͔ͬͨ࣌ظ ʹಉ༷ͷ͜ͱΛ͢ΔͨΊͷͷͩͬͨ • TransportWebSocketͰͳͯ͘Α͍ • TransportEngine.IOͰநԽ͞Ε͍ͯΔ
Engine.IO • Socket.IOͷͨΊʹ࡞ΒΕͨRealtime Engine • ௨৴ϨΠϠʔ·Ͱ͔͠ݟͳ͍ • eventͱ͔ͦ͏͍͏ػೳଘࡏ͠ͳ͍
Engine.IO • WebSocket [packet] • Polling [payload] • XMLHttpRequest •
JSONP • MUST support three transport
8FC4PDLFU 9.-)UUQ3FRVFTU +40/1 &OHJOF*0 4PDLFU*0 #SPXTFS$MJFOU
͑ͬ໘ष͞ ࠓͷ࣌ WebSocketͰ͍͍Ͱ͠ΐ
https://blog.jxck.io/entries/ 2016-08-22/websocket- connectivity.html
·ͱΊ • RFCʹଇͬͨWebSocketIE11͔Β • Connection: UpgradeΛམͱ͢ϛυϧϘοΫε • HTTPͰ࣌ؒுΓͬͺͳ͠ͷίωΫγϣϯΛ ΔϛυϧϘοΫε
·ͱΊ • RFCʹଇͬͨWebSocketIE11͔Β • Connection: UpgradeΛམͱ͢ϛυϧϘοΫε • HTTPͰ࣌ؒுΓͬͺͳ͠ͷίωΫγϣϯΛ ΔϛυϧϘοΫε IEͬͯͳΜͰ͔͢ʁ
·ͱΊ • RFCʹଇͬͨWebSocketIE11͔Β • Connection: UpgradeΛམͱ͢ϛυϧϘοΫε • HTTPͰ࣌ؒுΓͬͺͳ͠ͷίωΫγϣϯΛ ΔϛυϧϘοΫε IEͬͯͳΜͰ͔͢ʁ
҉߸Խ͢Εͳ͍Ͱ͢. wssΛ͏.
·ͱΊ • RFCʹଇͬͨWebSocketIE11͔Β • Connection: UpgradeΛམͱ͢ϛυϧϘοΫε • HTTPͰ࣌ؒுΓͬͺͳ͠ͷίωΫγϣϯΛ ΔϛυϧϘοΫε IEͬͯͳΜͰ͔͢ʁ
҉߸Խ͢Εͳ͍Ͱ͢. wssΛ͏. Ͳ͏ʹͳΒͳ͍
·ͱΊ • ࣮ࡍͲͷఔଘࡏ͢Δͷ͔Θ͔Βͳ͍ • ͍ΜͨʔͶͬͱ͍͠ͷͰଞͷݪҼ͋Δ • ϦΞϧλΠϜ௨৴͕؊Ͱ͍ΖΜͳڥͷϢʔβ ʹͬͯΒ͍͍ͨ߹Socket.IO
େઢ͠·͕ͨ͠
Socket.IOΛΔʹ
8FC4PDLFU 9.-)UUQ3FRVFTU +40/1 &OHJOF*0 4PDLFU*0 #SPXTFS$MJFOU
ਓ͕ؒ WebSocketΔͷ “””͍͠”””
ͦΕΑΓ্ͷϨΠϠʔ ͱ͍͏͜ͱʹ͠·͢
8FC4PDLFU 9.-)UUQ3FRVFTU +40/1 &OHJOF*0 4PDLFU*0 #SPXTFS$MJFOU
·ͣEngine.IOΛΔ
Engine.IO • https://github.com/socketio/engine.io-protocol • ࠓrevision: 3 • ͘͢͝γϯϓϧͰ໋ྩ͕7छྨ͔͠ͳ͍ • <packet
type id>[data] ୯७ͳformat
Engine.IO • 0 open, αʔό͔Β࠷ॳʹૹΒΕͯ͘Δ • 1 close, அ͢Δͱ͖ʹૹΔ •
2 ping, ͪ͜Β͔ΒૹΔੜଘใࠂ • 3 pong, pingΛड͚औͬͨ࣌ʹαʔό͔Βฦͬͯ͘Δ • 4 message, σʔλΛૹड৴͢Δ࣌ʹ͏ • 5 upgrade, transportΛม͑Δ࣌ʹૹΔ • 6 noop, ͳʹ͠ͳ͍
git clone https://github.com/orisano/socketio-handson cd socketio-handson npm i npm run serve:eio
npm run conn:eio
Engine.IO • < 0******* // open • > 2 //
ping • < 3 // pong • > 4hello. engine.io // message • < 4reply:hello
͜ΕͰEngine.IOᘳ
͋ͱSocket.IO͕ΕΕ
Socket.IO • https://github.com/socketio/socket.io-protocol • ࠓrevision: 4 • ͘͢͝γϯϓϧͰ໋ྩ͕7छྨ͔͠ͳ͍ • formatͷৄࡉʹ͍ͭͯ͋·Γॻ͍ͯͳ͍
Socket.IO • socket.io-parserͷ࣮ΛݟΔ • <packet type id>[(attachments)-] [(namespace:/),][id][data] • ͏Μ,
simple
Socket.IO • 0 CONNECT, αʔό͔Β࠷ॳʹૹΒΕͯ͘Δ • 1 DISCONNECT, அ͢Δͱ͖ʹૹΔ •
2 EVENT, Πϕϯτ͕ى͖ͨ࣌ʹૹड৴͢Δ • 3 ACK,ಛఆͷύέοτʹରͯ͠ฦ৴͢Δ࣌ʹ͏ • 4 ERROR,Τϥʔ͕ى͖ͨ࣌ʹ͏ • 5 BINARY_EVENT, όΠφϦΛૹΔ࣌ͬͪ͜ • 6 BINARY_ACK, όΠφϦΛฦ࣌ͬͪ͢͜
npm run serve:sio npm run conn:sio
Socket.IO • > 0 // e:open • > 40 //
e:message s:connect • < 42[“message”,”hello”] // e:message s:event data • > 42[“reply”,”?hello”] // e:message s:event data • < 41 // e:message s:disconnect • < 42[“message”,”hello”] // e:message s:event data • < 40 // e:message s:connect • < 42[“message”,”hello”] // e:message s:event data • > 42[“reply”,”?hello”] // e:message s:event data
͜ΕͰSocket.IOᘳ
ͦͦ
ͳΜͰSocket.IOͷʁ
https://github.com/orisano/gomasio socket.io-clientͷgolang࣮Λ ࡞ͬͨͷͰએ