Your SlideShare is downloading. ×
Let web sockets hit that f5 for you
Upcoming SlideShare
Loading in...5
×

Thanks for flagging this SlideShare!

Oops! An error has occurred.

×
Saving this for later? Get the SlideShare app to save on your phone or tablet. Read anywhere, anytime – even offline.
Text the download link to your phone
Standard text messaging rates apply

Let web sockets hit that f5 for you

330
views

Published on

Published in: Software

0 Comments
0 Likes
Statistics
Notes
  • Be the first to comment

  • Be the first to like this

No Downloads
Views
Total Views
330
On Slideshare
0
From Embeds
0
Number of Embeds
1
Actions
Shares
0
Downloads
5
Comments
0
Likes
0
Embeds 0
No embeds

Report content
Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
No notes for slide

Transcript

  • 1. Let WebSockets hit that for you Slides: http://goo.gl/YH6lDp (YH6…lowercase “L”…Dp) Demo: http://goo.gl/7ecjYY
  • 2. About me ● Born and raised in MD ● Developer at Teaching Strategies, LLC ○ Early childhood education resources ● Past: UMD, UMUC, NASA, MD Archives, NIST ● First time presenting at conference ● Project: CFScript Converter
  • 3. ● HTML5 WebSockets ● Pusher ● CFWebSocket tag Topics for today
  • 4. Poll Want real-time features now? Have already implemented real-time features?
  • 5. WebSockets
  • 6. Real-time Web
  • 7. Real-time Web “Realtime refers to the timely nature between an event’s occurrence and our being made aware of it.” -Jason Lengstdorf and Phil Leggeter
  • 8. Real-time
  • 9. Real-time
  • 10. Real-time
  • 11. Use cases ● System-wide alerts ● CRUD forms ● Live grids ● Real-time graphs ● Real-time maps ● Business collaboration ● Idle time sign off ● CMS updates
  • 12. Demos
  • 13. Before WebSockets ● Java applets ● ActiveX ● Flash ● Ajax
  • 14. Polling
  • 15. Long polling
  • 16. 2-year old’s approach Dad are we there yet? Dad are we there yet? Dad are we there yet? No No Yes!
  • 17. HTTP headers are inefficient Request URL: http://help.adobe.com/en_US/ColdFusion/10.0/Developing/terms.js Request Method: GET Status Code: 200 OK Request Headersview source Accept: */* Accept-Encoding: gzip,deflate,sdch Accept-Language: en-US,en;q=0.8 Cache-Control: max-age=0 Connection: keep-alive Cookie: topicId=WSe61e35da8d31851852cc9f7d1353e88b409-7fff.html;kal3ljKFQLEkldekaaeka;kLEKELKFLiadaoeldoapkekEpakd
  • 18. Streaming ● Is in fact a duplex connection ● HTTP headers still included
  • 19. ● Full duplex connection ○ Client and server maintain an open connection ● Light on bandwidth ● Ability to broadcast messages ● A brand new protocol What we want
  • 20. WebSockets URIs ws://echo.websocket.org wss://echo.websocket.org
  • 21. WebSocket request GET /echo HTTP/1.1 Host: echo.websocket.org Origin: http://www.websocket.org Sec-WebSocket-Key: 7+C600xYybOv2zmJ69RQsw== Sec-WebSocket-Version: 13 Upgrade: websocket
  • 22. WebSockets response 101 Switching Protocols Connection: Upgrade Date: Wed, 20 Jun 2012 03:39:49 GMT Sec-WebSocket-Accept: fYoqiH14DgI+5ylEMwM2sOLzOi0= Server: Kaazing Gateway Upgrade: WebSocket
  • 23. WebSockets events onopen : connection opened onmessage : message received from server onclose : connection closed (normally or abruptly) onerror : error
  • 24. HTML5 WebSockets API
  • 25. Server-side Solutions
  • 26. Server-side Libraries Python ● Tornado ● Pywebsocket ● Autobahn ● txWS ● WebSocket for Python Ruby ● Php-websocket ● Rachet ● Hoar JavaScript ● Socket IO ● WebSocket-Node .NET ● IIS8 ● Fleck PHP ● Php-websocket ● Rachet ● Hoar Java ● Tomcat ● JBoss ● GlassFish ● Jetty
  • 27. Solutions Pusher ColdFusion 10+ CFWebSocket
  • 28. Pusher Web page Pusher.cfc Pusher API Client 1 Client 3Client 2 Client 4 (form post) (Many thanks to Ben Nadel)
  • 29. Channels Pusher Client 1 Client 3Client 2 Client 4 Client 5 Carousel Channel Emergency Alerts Channel DB Updates Channel
  • 30. Unlimited Channels Pusher Channel 1 Channel (n)Channel 2 Channel 3 Channel 4 …
  • 31. Unlimited Event Types Channel Event 1 Event (n)Event 2 Event 3 Event 4 …
  • 32. Pusher.cfc
  • 33. Code Walkthrough
  • 34. Disadvantages 1. It costs $$$ based on traffic (e.g. 500 connections per month = $50) 2. Information goes through an external service (privacy) Pusher Advantages 1. Highly scalable 2. Add new channels at any time 3. Custom events 4. Will work on any platform, even static HTML files 5. One less thing to worry about
  • 35. CFWebSocket Application.cfc
  • 36. CFWebSocket
  • 37. CFWebSocket
  • 38. CFWebSocket
  • 39. Disadvantages 1. Need to upgrade to CF10+ 2. Can’t add channels dynamically (see Application. cfc) 3. Global JavaScript vars 4. Load balanced environment? CFWebSocket Advantages 1. Supports channel paradigm 2. Can integrate with internal authentication 3. Integrates with existing CFLogin/Authentication
  • 40. Security
  • 41. Security ● Denial of service ● Cross-site scripting (XSS) ● Man in the Middle ● Authentication Client Server Always use wss:// on production systems!!!
  • 42. DDOS
  • 43. XSS
  • 44. Fallbacks ● Flash ● Ajax Polling ● Graceful WebSocket (jQuery plug-in) ● Portal ● DataChannel ● Atmosphere ● web-socket-js ● Kaazing WebSocket Gateway
  • 45. Realtime Web Apps (Apress) The Definitive Guide to HTML5 WebSocket (Apress) Getting Started with HTML5 WebSocket Programming (PacktPub) *Echo test service How can I get started?
  • 46. The End Contact Me Twitter: @joseGaldamez GitHub: http://github.com/galdamez E-mail: galdamez@gmail.com