WebSocket
Ein bidirektionales Netzwerkprotokoll für das Web
Demos
Ablauf
- Dauer ca. 60 Minuten
- Teil 1: Theorie
- Teil 2: Code!
Was ist WebSocket?
- Effizientes Netzwerkprotokoll basierend auf TCP
- Initiiert über HTTP (im Browser via Javascript)
- Bidirektionale Verbindung (full-duplex)
- Teil der HTML5 Initiative
Was ist WebSocket NICHT ?
- Eine Implementierung
- Ein Ersatz für HTTP oder REST
- Mobile-Only
- Nur für Browser
Wozu braucht man das?
- Für Server-Push
- Für Datenübertragung mit niedriger Latenz (Echtzeitkommunikation)
- Flexibilität beim Design eines eigenen Protokolls
Einsatzgebiet
Browser ↔ Webserver
Rich-Client ↔ Webserver
Polling
Long-Polling
Motivation
- Ablöse von Long-Polling "Hacks"
- Einschränkungen durch Request+Response von HTTP
- Ineffiziente HTTP Header
- Gemeinsame Kommunikation durch nur 1 einzelne Verbindung
- Den Browser als Clientplatform der Zukunft stärken
WebSocket
Eigenschaften
- Standardisiert (RFC 6455, W3C WS API, Ende 2011)
- Baut auf TCP auf (nicht HTTP)
- Effizient (6 Bytes Header)
- Bidirektional
- URLs in Form von ws:// oder wss://
- Weit verbreitet
- Gute Unterstützung (Browser, Libraries, Webserver, ...)
WebSocket Handshake
Client → Server
GET ws://websocket.example.com/ HTTP/1.1
Host: websocket.example.com
Connection: Upgrade
Upgrade: websocket
Sec-WebSocket-Key: uRovscZjNol/umbTt5uKmw==
Server → Client
HTTP/1.1 101 Switching Protocols
Upgrade: websocket
Connection: Upgrade
Sec-WebSocket-Accept: s3pPLMBiTxaQ9kYGzzhZRbK+xOo=
Javascript (Client)
var ws = new WebSocket('ws://example.com/socket'); // 1
ws.onerror = function (error) { ... } // 2
ws.onclose = function () { ... } // 3
ws.onopen = function () { // 4
ws.send("Connection established. Hello server!"); // 5
}
ws.onmessage = function(msg) { // 6
if(msg.data instanceof Blob) { // 7
processBlob(msg.data);
} else {
processText(msg.data);
}
}