Recommandé
Contenu connexe
Tendances
Tendances (20)
En vedette
Similaire à Pushing the web — WebSockets
Similaire à Pushing the web — WebSockets (20)
Dernier
Dernier (20)
Pushing the web — WebSockets
- 1. Pushing the Web with WebSockets. Roland Moriz, Moriz GmbH http://www.moriz.de/ http://www.IsItRails.com/
- 2. HTTP is a stateless protocol. Request GET / HTTP/1.1 Host www.moriz.de User-Agent Mozilla/5.0 (Macintosh; U; Intel Mac OS X 10_6_3; de-de) ... Accept application/xml,application/xhtml+xml,text/html;q=0.9,text/plain; ...
- 3. HTTP is a stateless protocol. Response HTTP/1.1 200 OK Content-Type: text/html; charset=utf-8 Vary: Accept-Encoding Status: 200 X-Powered-By: Phusion Passenger (mod_rails/mod_rack) 2.2.11 ETag: "857fa3051dead14aca5efdbc8721f6a1" X-Runtime: 20 Cache-Control: max-age=43200, public Server: nginx/0.7.64 + Phusion Passenger 2.2.11 (mod_rails/mod_rack) Content-Encoding: gzip Content-Length: 2027 Date: Fri, 11 Jun 2010 08:45:10 GMT X-Varnish: 692995266 692995045 Age: 3535 Via: 1.1 varnish Connection: keep-alive X-Cache: HIT <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1- transitional.dtd"> <!-- All your Base are belong to us! -->
- 4. HTTP Client Server
- 5. CC / via http://www.flickr.com/photos/stevendepolo/3212039475/
- 6. PUSH event driven! Client Server stock price change chat response game event ...
- 7. PUSH what we‘ve used in the past „Comet“ „HTTP Streaming“ Flash XMLHttpRequest Java Applet ...
- 8. PUSH what we‘ve used in the past „Fake push“ • cyclic polling (each x seconds) • delayed response • netscape‘s 1995 mulitpart HTTP response • chuncked block http response (http://en.wikipedia.org/wiki/Chunked_transfer_encoding)
- 9. PUSH what we‘ve used in the past „Fake push“ SUCKS. • cyclic polling (each x seconds) • delayed response • netscape‘s 1995 mulitpart HTTP response • chuncked block http response (http://en.wikipedia.org/wiki/Chunked_transfer_encoding)
- 10. PUSH what we‘ve used in the past „Plugins“ Persistent Bi-Directional Connection Flash JavaScript Server Java Applet DOM
- 11. PUSH what we‘ve used in the past „Plugins“ Persistent Bi-Directional Connection Flash DOM Server Java Applet
- 12. PUSH what we‘ve used in the past „Plugins“ Persistent FREAKS. Bi-Directional Connection Flash DOM Server Java Applet
- 13. PUSH what we‘ve used in the past „Plugins“ Persistent Bi-Directional Connection Browser Plugin Server
- 14. PUSH what we actually want Persistent Bi-Directional Connection Browser Server
- 15. WebSockets!
- 16. var socket = new WebSocket('ws://vm.io/channel/ruby-muenchen'); socket.onopen = function() { ... }; socket.onmessage = function() { ... }; socket.onerror = function() { ... }; socket.onclose = function() { ... };
- 17. Specs • http://www.whatwg.org/specs/web- apps/current-work/ • http://www.whatwg.org/specs/web- socket-protocol/ • http://tools.ietf.org/html/draft-hixie- thewebsocketprotocol-76 • http://dev.w3.org/html5/websockets/ WHATWG = Web Hypertext Application Technology Working Group
- 18. WebSockets
- 19. WebSockets
- 20. var socket = new WebSocket('ws://example.com/chat'); socket.onopen = function() { ... }; socket.onmessage = function() { ... }; socket.onerror = function() { ... }; socket.onclose = function() { ... };
- 21. WebSockets it‘s HTTP and it isn‘t HTTP. Request GET /demo HTTP/1.1 Host: example.com Connection: Upgrade Sec-WebSocket-Key2: 12998 5 Y3 1 .P00 Sec-WebSocket-Protocol: sample Upgrade: WebSocket Sec-WebSocket-Key1: 4 @1 46546xW%0l 1 5 Origin: http://example.com ^n:ds[4U
- 22. WebSockets it‘s HTTP and it isn‘t HTTP. Request GET /demo HTTP/1.1 Host: example.com Connection: Upgrade Sec-WebSocket-Key2: 12998 5 Y3 1 .P00 Sec-WebSocket-Protocol: sample Upgrade: WebSocket Sec-WebSocket-Key1: 4 @1 46546xW%0l 1 5 Origin: http://example.com ^n:ds[4U
- 23. WebSockets it‘s HTTP and it isn‘t HTTP. Response HTTP/1.1 101 WebSocket Protocol Handshake Upgrade: WebSocket Connection: Upgrade Sec-WebSocket-Origin: http://example.com Sec-WebSocket-Location: ws://example.com/demo Sec-WebSocket-Protocol: sample 8jKS'y:G*Co,Wxa-
- 24. WebSockets + • connection handshake uses HTTP infrastructure - • no extra ports (firewall etc) • proxy support (well....) • no overhead (only 2 bytes per frame!) • very low latency • clean browser interface
- 25. WebSockets • connection process uses HTTP infrastructure asynchronous request performance! needs special event driven http server (event-machine, node.js) to scale!
- 26. WebSockets • proxy support proxies need to support „upgrade“ workaround: use TLS
- 29. var socket = new WebSocket('ws://vm.io/wm'); ssl/tls: var socket = new WebSocket('wss://vm.io/wm'); support a bit tricky at the moment...
- 30. Native Browser Support • Safari 5 (desktop) & iOS 4.0 • Google Chrome >= 4.0.249.0 • Firefox 4.0 ? https://bugzilla.mozilla.org/show_bug.cgi?id=472529 http://hacks.mozilla.org/2010/04/websockets-in-firefox/ • IE ??? :-( http://jimbergman.net/websocket-web-browser-test/
- 31. Emulated Browser Support http://kaazing.org/ http://github.com/gimite/web-socket-js
- 32. Ruby :-)
- 33. Ruby :-) • http://github.com/gimite/web-socket- ruby • http://github.com/igrigorik/em- websocket
- 34. EventMachine::WebSocket EventMachine.run { EventMachine::WebSocket.start(:host => "0.0.0.0", :port => 80) do |ws| ws.onopen { puts "WebSocket connection open" # publish message to the client ws.send "Hello Client" } ws.onclose { puts "Connection closed" } ws.onmessage { |msg| puts "Recieved message: #{msg}" ws.send "Pong: #{msg}" } end }
- 35. Example 1+2
- 36. JSON AMQP Bayeux STOMP XMPP (Jabber) BOSH etc.. Current limitation: No binary data!
- 37. !!! WARNING: At this time, the WebSocket protocol cannot be used to send binary data. Using any of the frame types other than 0x00 and 0xFF is invalid. All other frame types are reserved for future use by future versions of this protocol.
- 39. Example • http://code.google.com/p/quake2-gwt- port/
- 40. Proxy Integration • http://www.infoq.com/articles/Web- Sockets-Proxy-Servers
- 41. other servers • http://www.kaazing.com/ http://www.kaazing.org (Java) Talk: http://is.gd/cQf4V Video: http://www.youtube.com/ watch?v=ZtLGU6xJpwM • http://orbited.org/ (Python)
- 42. PusherApp • http://pusherapp.com/ • Push only (one-way)
- 43. PubNub.com • http://www.pubnub.com/
- 44. Servers Ruby, JavaScript (node.js), Python, Java (jetty, glassfish 3.1, resin) ... ...even Arduino! http://blog.razerbeans.com/arduino-web-socket-library http://github.com/razerbeans/WebSocket-Arduino
- 45. => Github.com => Search => WebSockets
- 46. mehr! • http://bergmans.com/WebSockets.html