html websockets
Problem with http
- Half-duplex communication
- Client driven
- New TCP connection for every request
- Too much overhead data sent with every request
sample http request
GET /en-US/docs/Web/API/WebSocket HTTP/1.1
Host: developer.mozilla.org
Connection: keep-alive
Pragma: no-cache
Cache-Control: no-cache
Accept: text/html,application/xhtml+xml,application/xml;q=0.9,image/webp,*/*;q=0.8
User-Agent: Mozilla/5.0 (Windows NT 6.1; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/41.0.2272.89 Safari/537.36
DNT: 1
Referer: https://developer.mozilla.org/en-US/docs/WebSockets/WebSockets_reference
Accept-Encoding: gzip, deflate, sdch
Accept-Language: en-GB,en-US;q=0.8,en;q=0.6
Cookie: optimizelyEndUserId=oeu1414035707459r0.8018952487036586; __utma=150903082.553603326.1414035708.1414467317.1415679468.2; __utmz=150903082.1415679468.2.2.utmcsr=codingforums.com|utmccn=(referral)|utmcmd=referral|utmcct=/dom-json-scripting/61921-tabindex-firefox.html; _gat=1; optimizelySegments=%7B%22237061344%22%3A%22none%22%2C%22237321400%22%3A%22gc%22%2C%22237335298%22%3A%22search%22%2C%22237485170%22%3A%22false%22%2C%22245617832%22%3A%22none%22%2C%22245677587%22%3A%22gc%22%2C%22245875585%22%3A%22search%22%2C%22246048108%22%3A%22false%22%2C%22704844240%22%3A%22true%22%2C%22743670347%22%3A%22true%22%2C%22869421433%22%3A%22true%22%2C%221623833307%22%3A%22true%22%2C%221894310134%22%3A%22true%22%2C%222083660019%22%3A%22true%22%7D; optimizelyBuckets=%7B%7D; _ga=GA1.2.553603326.1414035708
sample http response (header)
HTTP/1.1 200 OK
Server: Apache
Vary: Cookie, Accept-Encoding
X-Backend-Server: developer3.webapp.scl3.mozilla.com
Content-Type: text/html; charset=utf-8
Access-Control-Allow-Credentials: false
Content-Encoding: gzip
Date: Tue, 17 Mar 2015 23:09:10 GMT
Keep-Alive: timeout=5, max=995
X-kuma-revision: 752533
Transfer-Encoding: chunked
Access-Control-Allow-Origin: *
ETag: "6ca26ecfcf64c3499ee56a5c00dc23570ad5f5a1"
Connection: Keep-Alive
X-Frame-Options: DENY
Last-Modified: Mon, 23 Feb 2015 13:10:35 GMT
Access-Control-Allow-Methods: GET
X-Cache-Info: not cacheable; response had too large vary data
HTML Websockets to the rescue
- Full-duplex communication
- After handshake, both client and server and peers
- Single TCP connection
- No verbose headers sent during communication
Sample handshake request
GET ws://echo.websocket.org/?encoding=text HTTP/1.1
Origin: http://websocket.org
Cookie: __utma=99as
Connection: Upgrade
Host: echo.websocket.org
Sec-WebSocket-Key: uRovscZjNol/umbTt5uKmw==
Upgrade: websocket
Sec-WebSocket-Version: 13
Sample handshake response
HTTP/1.1 101 WebSocket Protocol Handshake
Date: Fri, 10 Feb 2012 17:38:18 GMT
Connection: Upgrade
Server: Kaazing Gateway
Upgrade: WebSocket
Access-Control-Allow-Origin: http://websocket.org Access-Control-Allow-Credentials: true
Sec-WebSocket-Accept: rLHCkw/SKsO9GAH/ZSFhBATDKrU=
Access-Control-Allow-Headers: content-type
How websocket works
Cool :)
can i use it now?
On the client side (browser)
demo
https://kiosklogin.herokuapp.com/experience
joesmith@example.com/password
web socket
By Tarun Sharma
web socket
- 471