Enviar búsqueda
Cargar
V2 peter-lubbers-sf-jug-websocket
•
Descargar como PPTX, PDF
•
3 recomendaciones
•
2,147 vistas
B
brent bucci
Seguir
Denunciar
Compartir
Denunciar
Compartir
1 de 92
Descargar ahora
Recomendados
HTML5 Real Time and WebSocket Code Lab (SFHTML5, GTUGSF)
HTML5 Real Time and WebSocket Code Lab (SFHTML5, GTUGSF)
Peter Lubbers
HTML5 WebSocket Introduction
HTML5 WebSocket Introduction
Marcelo Jabali
Websocket protocol overview
Websocket protocol overview
allenmeng
Introduction to WebSockets
Introduction to WebSockets
Gunnar Hillert
Pushing the web — WebSockets
Pushing the web — WebSockets
Roland M
WebSocket protocol
WebSocket protocol
Kensaku Komatsu
HTML5 WebSocket for the Real-Time Weband the Internet of Things
HTML5 WebSocket for the Real-Time Weband the Internet of Things
Peter Moskovits
Websocket shanon
Websocket shanon
Takafumi Ikeda
Recomendados
HTML5 Real Time and WebSocket Code Lab (SFHTML5, GTUGSF)
HTML5 Real Time and WebSocket Code Lab (SFHTML5, GTUGSF)
Peter Lubbers
HTML5 WebSocket Introduction
HTML5 WebSocket Introduction
Marcelo Jabali
Websocket protocol overview
Websocket protocol overview
allenmeng
Introduction to WebSockets
Introduction to WebSockets
Gunnar Hillert
Pushing the web — WebSockets
Pushing the web — WebSockets
Roland M
WebSocket protocol
WebSocket protocol
Kensaku Komatsu
HTML5 WebSocket for the Real-Time Weband the Internet of Things
HTML5 WebSocket for the Real-Time Weband the Internet of Things
Peter Moskovits
Websocket shanon
Websocket shanon
Takafumi Ikeda
The HTML5 WebSocket API
The HTML5 WebSocket API
David Lindkvist
vlavrynovych - WebSockets Presentation
vlavrynovych - WebSockets Presentation
Volodymyr Lavrynovych
HTML5 WebSocket: The New Network Stack for the Web
HTML5 WebSocket: The New Network Stack for the Web
Peter Lubbers
Nuts and Bolts of WebSocket Devoxx 2014
Nuts and Bolts of WebSocket Devoxx 2014
Arun Gupta
20190516 web security-basic
20190516 web security-basic
MksYi
Php push notifications
Php push notifications
Mohammed Shurrab
Websockets in Node.js - Making them reliable and scalable
Websockets in Node.js - Making them reliable and scalable
Gareth Marland
Intro to WebSockets
Intro to WebSockets
Gaurav Oberoi
HTTPS and HTTP/2
HTTPS and HTTP/2
MatthewWalker9
Websockets at tossug
Websockets at tossug
clkao
HTML5 WebSockets
HTML5 WebSockets
Harri Hämäläinen
J web socket
J web socket
Hiroshi Ochi
WEB SOCKET 應用
WEB SOCKET 應用
Jerromy Lee
WebSockets On Fire
WebSockets On Fire
Jef Claes
4Developers 2015: Bypassing Same-Origin Policy - Jakub Żoczek
4Developers 2015: Bypassing Same-Origin Policy - Jakub Żoczek
PROIDEA
Apache httpd 2.4 Reverse Proxy: The Hidden Gem
Apache httpd 2.4 Reverse Proxy: The Hidden Gem
Jim Jagielski
WebSockets Everywhere: the Future Transport Protocol for Everything (Almost)
WebSockets Everywhere: the Future Transport Protocol for Everything (Almost)
Ericom Software
Building Next Generation Real-Time Web Applications using Websockets
Building Next Generation Real-Time Web Applications using Websockets
Naresh Chintalcheru
Google Chromebook for the Enterprise: Yeah or Meh?
Google Chromebook for the Enterprise: Yeah or Meh?
Ericom Software
Apache HTTPD 2.4 Reverse Proxy: The Hidden Gem
Apache HTTPD 2.4 Reverse Proxy: The Hidden Gem
Jim Jagielski
Dev con kolkata 2012 websockets
Dev con kolkata 2012 websockets
SANKARSAN BOSE
Camelone-2012 HTML5 WebSocket ActiveMQ/Camel
Camelone-2012 HTML5 WebSocket ActiveMQ/Camel
Charles Moulliard
Más contenido relacionado
La actualidad más candente
The HTML5 WebSocket API
The HTML5 WebSocket API
David Lindkvist
vlavrynovych - WebSockets Presentation
vlavrynovych - WebSockets Presentation
Volodymyr Lavrynovych
HTML5 WebSocket: The New Network Stack for the Web
HTML5 WebSocket: The New Network Stack for the Web
Peter Lubbers
Nuts and Bolts of WebSocket Devoxx 2014
Nuts and Bolts of WebSocket Devoxx 2014
Arun Gupta
20190516 web security-basic
20190516 web security-basic
MksYi
Php push notifications
Php push notifications
Mohammed Shurrab
Websockets in Node.js - Making them reliable and scalable
Websockets in Node.js - Making them reliable and scalable
Gareth Marland
Intro to WebSockets
Intro to WebSockets
Gaurav Oberoi
HTTPS and HTTP/2
HTTPS and HTTP/2
MatthewWalker9
Websockets at tossug
Websockets at tossug
clkao
HTML5 WebSockets
HTML5 WebSockets
Harri Hämäläinen
J web socket
J web socket
Hiroshi Ochi
WEB SOCKET 應用
WEB SOCKET 應用
Jerromy Lee
WebSockets On Fire
WebSockets On Fire
Jef Claes
4Developers 2015: Bypassing Same-Origin Policy - Jakub Żoczek
4Developers 2015: Bypassing Same-Origin Policy - Jakub Żoczek
PROIDEA
Apache httpd 2.4 Reverse Proxy: The Hidden Gem
Apache httpd 2.4 Reverse Proxy: The Hidden Gem
Jim Jagielski
WebSockets Everywhere: the Future Transport Protocol for Everything (Almost)
WebSockets Everywhere: the Future Transport Protocol for Everything (Almost)
Ericom Software
Building Next Generation Real-Time Web Applications using Websockets
Building Next Generation Real-Time Web Applications using Websockets
Naresh Chintalcheru
Google Chromebook for the Enterprise: Yeah or Meh?
Google Chromebook for the Enterprise: Yeah or Meh?
Ericom Software
Apache HTTPD 2.4 Reverse Proxy: The Hidden Gem
Apache HTTPD 2.4 Reverse Proxy: The Hidden Gem
Jim Jagielski
La actualidad más candente
(20)
The HTML5 WebSocket API
The HTML5 WebSocket API
vlavrynovych - WebSockets Presentation
vlavrynovych - WebSockets Presentation
HTML5 WebSocket: The New Network Stack for the Web
HTML5 WebSocket: The New Network Stack for the Web
Nuts and Bolts of WebSocket Devoxx 2014
Nuts and Bolts of WebSocket Devoxx 2014
20190516 web security-basic
20190516 web security-basic
Php push notifications
Php push notifications
Websockets in Node.js - Making them reliable and scalable
Websockets in Node.js - Making them reliable and scalable
Intro to WebSockets
Intro to WebSockets
HTTPS and HTTP/2
HTTPS and HTTP/2
Websockets at tossug
Websockets at tossug
HTML5 WebSockets
HTML5 WebSockets
J web socket
J web socket
WEB SOCKET 應用
WEB SOCKET 應用
WebSockets On Fire
WebSockets On Fire
4Developers 2015: Bypassing Same-Origin Policy - Jakub Żoczek
4Developers 2015: Bypassing Same-Origin Policy - Jakub Żoczek
Apache httpd 2.4 Reverse Proxy: The Hidden Gem
Apache httpd 2.4 Reverse Proxy: The Hidden Gem
WebSockets Everywhere: the Future Transport Protocol for Everything (Almost)
WebSockets Everywhere: the Future Transport Protocol for Everything (Almost)
Building Next Generation Real-Time Web Applications using Websockets
Building Next Generation Real-Time Web Applications using Websockets
Google Chromebook for the Enterprise: Yeah or Meh?
Google Chromebook for the Enterprise: Yeah or Meh?
Apache HTTPD 2.4 Reverse Proxy: The Hidden Gem
Apache HTTPD 2.4 Reverse Proxy: The Hidden Gem
Similar a V2 peter-lubbers-sf-jug-websocket
Dev con kolkata 2012 websockets
Dev con kolkata 2012 websockets
SANKARSAN BOSE
Camelone-2012 HTML5 WebSocket ActiveMQ/Camel
Camelone-2012 HTML5 WebSocket ActiveMQ/Camel
Charles Moulliard
Web browsers & the realtime web
Web browsers & the realtime web
Phil Leggetter
Jwebsocketmobiletechcon2010en 100912071225 Phpapp01
Jwebsocketmobiletechcon2010en 100912071225 Phpapp01
purans
jWebSocket MobileTechCon 2010 - WebSockets on Android, Symbian and BlackBerry
jWebSocket MobileTechCon 2010 - WebSockets on Android, Symbian and BlackBerry
Innotrade GmbH, jWebSocket.org, Alexander Schulze
WebSocket Perspectives and Vision for the Future
WebSocket Perspectives and Vision for the Future
Frank Greco
HTML5 Web Workers-unleashed
HTML5 Web Workers-unleashed
Peter Lubbers
OWASP Top 10 - Checkmarx Presentation at Polytechnic Institute of Cávado and Ave
OWASP Top 10 - Checkmarx Presentation at Polytechnic Institute of Cávado and Ave
Checkmarx
Programming WebSockets - OSCON 2010
Programming WebSockets - OSCON 2010
sullis
Browser Security
Browser Security
Roberto Suggi Liverani
Top 10 HTML5 Features for Oracle Cloud Developers
Top 10 HTML5 Features for Oracle Cloud Developers
Brian Huff
Web of Things - Connecting People and Objects on the Web
Web of Things - Connecting People and Objects on the Web
Dominique Guinard
Hello websocket(cn)
Hello websocket(cn)
g65537
Nodejs and WebSockets
Nodejs and WebSockets
Gonzalo Ayuso
Peter lubbers-html5-offline-web-apps
Peter lubbers-html5-offline-web-apps
Skills Matter
Websocket
Websocket
艾鍗科技
WebSockets: The Current State of the Most Valuable HTML5 API for Java Developers
WebSockets: The Current State of the Most Valuable HTML5 API for Java Developers
Viktor Gamov
Browser security
Browser security
Uday Anand
Enhancing Mobile User Experience with WebSocket
Enhancing Mobile User Experience with WebSocket
Mauricio "Maltron" Leal
5-WebServers.ppt
5-WebServers.ppt
webhostingguy
Similar a V2 peter-lubbers-sf-jug-websocket
(20)
Dev con kolkata 2012 websockets
Dev con kolkata 2012 websockets
Camelone-2012 HTML5 WebSocket ActiveMQ/Camel
Camelone-2012 HTML5 WebSocket ActiveMQ/Camel
Web browsers & the realtime web
Web browsers & the realtime web
Jwebsocketmobiletechcon2010en 100912071225 Phpapp01
Jwebsocketmobiletechcon2010en 100912071225 Phpapp01
jWebSocket MobileTechCon 2010 - WebSockets on Android, Symbian and BlackBerry
jWebSocket MobileTechCon 2010 - WebSockets on Android, Symbian and BlackBerry
WebSocket Perspectives and Vision for the Future
WebSocket Perspectives and Vision for the Future
HTML5 Web Workers-unleashed
HTML5 Web Workers-unleashed
OWASP Top 10 - Checkmarx Presentation at Polytechnic Institute of Cávado and Ave
OWASP Top 10 - Checkmarx Presentation at Polytechnic Institute of Cávado and Ave
Programming WebSockets - OSCON 2010
Programming WebSockets - OSCON 2010
Browser Security
Browser Security
Top 10 HTML5 Features for Oracle Cloud Developers
Top 10 HTML5 Features for Oracle Cloud Developers
Web of Things - Connecting People and Objects on the Web
Web of Things - Connecting People and Objects on the Web
Hello websocket(cn)
Hello websocket(cn)
Nodejs and WebSockets
Nodejs and WebSockets
Peter lubbers-html5-offline-web-apps
Peter lubbers-html5-offline-web-apps
Websocket
Websocket
WebSockets: The Current State of the Most Valuable HTML5 API for Java Developers
WebSockets: The Current State of the Most Valuable HTML5 API for Java Developers
Browser security
Browser security
Enhancing Mobile User Experience with WebSocket
Enhancing Mobile User Experience with WebSocket
5-WebServers.ppt
5-WebServers.ppt
V2 peter-lubbers-sf-jug-websocket
1.
San Francisco Java
User Group Meeting May 11, 2010 HTML5 WebSocket& Communication By Peter Lubbers, Kaazing
2.
3.
4.
New Yorkhttp://www.meetup.com/NY-HTML5-User-Group/First meetup:
16 June
5.
6.
HTML5 WebSocket Copyright
© 2010 - Kaazing Corporation. All rights reserved.
7.
8.
Not just broadcast,
but bi-directional communication
9.
Examples:
10.
Financial applications
11.
Social networking applications
12.
Online games
13.
Smart power gridCopyright
© 2010 - Kaazing Corporation. All rights reserved.
14.
The Perils of
Polling Copyright © 2010 - Kaazing Corporation. All rights reserved. No-Fly list notupdated…
15.
HTTP Is Not
Full Duplex Copyright © 2010 - Kaazing Corporation. All rights reserved.
16.
17.
Header information is
sent with each HTTP request and response, which can be an unnecessary overheadCopyright © 2010 - Kaazing Corporation. All rights reserved.
18.
19.
20.
Half-Duplex Architecture Copyright
© 2010 - Kaazing Corporation. All rights reserved.
21.
Polling Architecture Copyright
© 2010 - Kaazing Corporation. All rights reserved.
22.
23.
Used in Ajax
applications to simulate real-time communication
24.
Browser sends HTTP
requests at regular intervals and immediately receives a responseIn low-message-rate situations, many connections are opened and closed needlessly Copyright © 2010 - Kaazing Corporation. All rights reserved.
25.
Long Polling Architecture
Copyright © 2010 - Kaazing Corporation. All rights reserved.
26.
27.
Browser sends a
request to the server and the server keeps the request open for a set period
28.
HTTP headers, present
in both long-polling and polling often account for most of the network trafficIn high-message rate situations, long-polling results in a continuous loop of immediate polls Copyright © 2010 - Kaazing Corporation. All rights reserved.
29.
Streaming Architecture Copyright
© 2010 - Kaazing Corporation. All rights reserved.
30.
31.
Possible complications:Proxies and
firewalls Response builds up and must be flushed periodically Cross-domain issues to do with browser connection limits Copyright © 2010 - Kaazing Corporation. All rights reserved.
32.
Comet Demo Copyright
© 2010 - Kaazing Corporation. All rights reserved.
33.
HTTP Request Headers
POST /gwt/EventService HTTP/1.1 Host: gpokr.com Connection: keep-alive User-Agent: Mozilla/5.0 (Windows; U; Windows NT 6.0; en-US) AppleWebKit/532.5 (KHTML, like Gecko) Chrome/4.1.249.1064 Safari/532.5 Referer: http://gpokr.com/gwt/7F5E66657B938E2FDE9CD39095A0E9E6.cache.html Content-Length: 134 Origin: http://gpokr.com Content-Type: text/plain; charset=utf-8 Accept: */* Accept-Encoding: gzip,deflate,sdch Accept-Language: en-US,en;q=0.8 Accept-Charset: ISO-8859-1,utf-8;q=0.7,*;q=0.3 Cookie: __utmz=247824721.1273102477.1.1.utmcsr=(direct)|utmccn=(direct)|utmcmd=(none); JSESSIONID=E7AAE0E60B01FB88D1E3799FAD5C62B3; __utma=247824721.1247485893.1273102477.1273104838.1273107686.3; __utmc=247824721; __utmb=247824721.4.10.127 Copyright © 2010 - Kaazing Corporation. All rights reserved.
34.
35.
Overhead can be
as much as 2000 bytesCopyright © 2010 - Kaazing Corporation. All rights reserved.
36.
37.
Use case A:
1,000 clients polling every second:
38.
Network throughput is
(871 x 1,000) = 871,000 bytes = 6,968,000 bits per second (~6.6 Mbps)
39.
Use case B:
10,000 clients polling every second:
40.
Network throughput is
(871 x 10,000) = 8,710,000 bytes = 69,680,000 bits per second (~66 Mbps)
41.
Use case C:
100,000 clients polling every second:
42.
Network throughput is
(871 x 100,000) = 87,100,000 bytes = 696,800,000 bits per second (~665 Mbps)Copyright © 2010 - Kaazing Corporation. All rights reserved.
43.
Comet: Headache 2.0
Copyright © 2010 - Kaazing Corporation. All rights reserved.
44.
Complexity does not
scale Copyright © 2010 - Kaazing Corporation. All rights reserved.
45.
Vote NO on
Tin Cans and String for Communication! Copyright © 2010 - Kaazing Corporation. All rights reserved.
46.
Enter HTML5 WebSocket!
Copyright © 2010 - Kaazing Corporation. All rights reserved.
47.
48.
Full-duplex text-based socket
49.
Enables web pages
to communicate with a remote host
50.
Traverses firewalls, proxies,
and routers seamlessly
51.
Leverages Cross-Origin Resource
Sharing (CORS)
52.
Share port with
existing HTTP content (80/443)Copyright © 2010 - Kaazing Corporation. All rights reserved.
53.
Pop Quiz What
does WebSocket have in common with model trains? Copyright © 2010 - Kaazing Corporation. All rights reserved.
54.
Possible WebSocket Architecture
Copyright © 2010 - Kaazing Corporation. All rights reserved.
55.
56.
57.
Once upgraded, WebSocket
data frames can be sent back and forth between the client and the server in full-duplex modeCopyright © 2010 - Kaazing Corporation. All rights reserved.
58.
HTML5 WebSocket Handshake
Client GET /text HTTP/1.1Upgrade: WebSocketConnection: UpgradeHost: www.example.com Origin: http://example.com WebSocket-Protocol: sample… Server HTTP/1.1 101 WebSocket Protocol HandshakeUpgrade: WebSocketConnection: Upgrade WebSocket-Origin: http://example.com WebSocket-Location: ws://example.com/demo WebSocket-Protocol: sample… Copyright © 2010 - Kaazing Corporation. All rights reserved.
59.
60.
61.
Using the WebSocket
API Copyright © 2010 - Kaazing Corporation. All rights reserved.
62.
Checking For Browser
Support JavaScript //Checking for browser support if (window.WebSocket) { document.getElementById("support").innerHTML = "HTML5 WebSocket is supported"; } else { document.getElementById("support").innerHTML = "HTML5 WebSocket is not supported"; } Copyright © 2010 - Kaazing Corporation. All rights reserved.
63.
Using the WebSocket
API JavaScript //Create new WebSocket var mySocket = new WebSocket(“ws://www.websocket.org”); // Associate listeners mySocket.onopen = function(evt) { alert(“Connection open…”); }; mySocket.onmessage = function(evt) { alert(“Received message: “ + evt.data); }; mySocket.onclose = function(evt) { alert(“Connection closed…”); }; Copyright © 2010 - Kaazing Corporation. All rights reserved.
64.
Using the WebSocket
API JavaScript // Sending data mySocket.send(“HTML5 WebSocket Rocks!”); //Close WebSocket mySocket.close(); Copyright © 2010 - Kaazing Corporation. All rights reserved.
65.
Browser Support for
WebSocket Chrome 4.0+ WebKit Nightly builds Support planned for Firefox:“We really really want to support WebSockets in the next version of Firefox.” –Christopher Blizzard, Mozilla Dev channel Copyright © 2010 - Kaazing Corporation. All rights reserved.
66.
Example: NativeWebSocket in
Chrome Copyright © 2010 - Kaazing Corporation. All rights reserved.
67.
68.
http://www.kaazing.com/download
69.
Makes WebSocket work
in all browsers today (including I.E. 6)
70.
Flash WebSocket implementation
71.
http://github.com/gimite/web-socket-js
72.
Requires opening port
on the server’s firewall Copyright © 2010 - Kaazing Corporation. All rights reserved.
73.
74.
You can extend
client-server protocols to the web:
75.
XMPP, Jabber
76.
Pub/Sub (Stomp/AMQP)
77.
Gaming protocols
78.
Any TCP-based protocol
79.
Browser becomes a
first-class network communication citizenCopyright © 2010 - Kaazing Corporation. All rights reserved.
80.
Financial Applications Copyright
© 2010 - Kaazing Corporation. All rights reserved.
81.
Example: WebSocket-Based Quake
II GamePort http://code.google.com/p/quake2-gwt-port Copyright © 2010 - Kaazing Corporation. All rights reserved.
82.
Twitter Feed http://kaazing.me
Copyright © 2010 - Kaazing Corporation. All rights reserved.
83.
WebSocket in the
Enterprise
84.
WebSocket and Web
Intermediaries Web Socket protocol itself is unaware of proxy servers and firewalls WebSocket features an HTTP-compatible handshake so that HTTP servers can share their default HTTP and HTTPS ports (80 and 443) with a WebSocket server Copyright © 2010 - Kaazing Corporation. All rights reserved.
85.
Securing WebSocket Traffic
WebSocket defines the ws:// and wss:// schemes WSS is WS over TLS (Transport Layer Security), formerly known as SSL (Secure Socket Layer) support (Similar to HTTPS) An HTTPS connection is established after a successful TLS handshake (using public and private key certificates) HTTPS is not a separate protocol, but it is HTTP running on top of a TLS connection (default ports is 443) Copyright © 2010 - Kaazing Corporation. All rights reserved.
86.
Proxy Servers A
proxy server is a server that acts as an intermediary between a client and another server (for example, a web server on the Internet) Commonly used for content caching, Internet connectivity, security, and enterprise content filtering May also buffer unencrypted HTTP responses, thereby introducing unpredictable latency during HTTP response streaming Copyright © 2010 - Kaazing Corporation. All rights reserved.
87.
Types of Proxy
Servers Copyright © 2010 - Kaazing Corporation. All rights reserved.
88.
WebSocket Proxy Traversal
Copyright © 2010 - Kaazing Corporation. All rights reserved. http://www.infoq.com/articles/Web-Sockets-Proxy-Servers
89.
Load Balancing Routers
TCP(layer-4) load-balancing routers should work well with HTML5 Web Sockets, because they have the same connection profile: connect once up front and stay connected, rather than the HTTP document transfer request-response profile HTTP (Layer 7) load-balancing routers expect HTTP traffic and can easily get confused by WebSocket upgrade traffic. For that reason, Layer 7 load balancing routers may need to be configured to be explicitly aware of WebSocket traffic Copyright © 2010 - Kaazing Corporation. All rights reserved.
90.
Firewalls Since firewalls
normally just enforce the rules for inbound traffic rejection and outbound traffic routing (for example, through the proxy server), there are usually no specific WebSocket traffic-related firewall concerns For regular socket connections (for example, for a desktop client) you must open a port on the firewall Copyright © 2010 - Kaazing Corporation. All rights reserved.
91.
WebSocket Traffic Analysis
92.
WebSocket Demo Copyright
© 2010 - Kaazing Corporation. All rights reserved.
93.
94.
No latency involved
in establishing new TCP connections for each HTTP message
95.
Dramatic reduction in
unnecessary network traffic and latency
96.
Remember the Polling
HTTP header traffic? 665 Mbps network throughput for just headersCopyright © 2010 - Kaazing Corporation. All rights reserved.
97.
98.
Use case A:
1,000 clients receive 1 message per second: Network throughput is (2 x 1,000) = 2,000 bytes = 16,000 bits per second (~0.015 Mbps)
99.
Use case B:
10,000 clients receive 1 message per second: Network throughput is (2 x 10,000) = 20,000 bytes = 160,000 bits per second (~0.153 Mbps)
100.
Use case C:
100,000 clients receive 1 message per second: Network throughput is (2 x 100,000) = 200,000 bytes = 1,600,000 bits per second (~1.526 Mbps)Copyright © 2010 - Kaazing Corporation. All rights reserved.
101.
Polling vs. WebSocket
Copyright © 2010 - Kaazing Corporation. All rights reserved.
102.
Latency Reduction Copyright
© 2010 - Kaazing Corporation. All rights reserved.
103.
Overheard…
“Reducing kilobytes of data to 2 bytes…and reducing latency from 150ms to 50ms is far more than marginal. In fact, these two factors alone are enough to make WebSocket seriously interesting to Google.” —Ian Hickson (Google, HTML5 spec lead) Copyright © 2010 - Kaazing Corporation. All rights reserved.
104.
HTML5 Communication Copyright
© 2010 - Kaazing Corporation. All rights reserved.
105.
HTML5 Communication HTML5
defines a few more handy communication features: Cross Document Messaging XMLHttpRequest Level 2 Server-Sent Events Copyright © 2010 - Kaazing Corporation. All rights reserved.
106.
Cross Document Messaging
Enables secure cross-origin communication across iframes, tabs, and windows (using origin security) Defines the PostMessage API as a standard way to send messages Provides asynchronous message passing between JavaScript contexts HTML5 clarifies and refines domain security by introducing the concept of an origin Copyright © 2010 - Kaazing Corporation. All rights reserved.
107.
Same-OriginPolicy The browsers’
same-origin policies prevent a script (or document) loaded from one origin from communicating with a document loaded from another origin Copyright © 2010 - Kaazing Corporation. All rights reserved.
108.
Origin Concept An
origin is a subset of an address used for modeling trust relationships on the Web Origins are made up of a scheme, a host, and a port—different origin: https://www.example.com http://www.example.com The path is not considered in the origin value—same origin: http://www.example.com/index.html http://www.example.com/page2.html Copyright © 2010 - Kaazing Corporation. All rights reserved.
109.
Cross Document Messaging
When you send a message, the sender specifies the receiver’s origin When you receive a message, the sender’s origin is included as part of the message (The message’s origin is provided by the browser and cannot be spoofed) This allows you to decide which messages to process and which to ignore You can keep a white list and process only messages from documents with trusted origins Copyright © 2010 - Kaazing Corporation. All rights reserved.
110.
PostMessage Architecture Copyright
© 2010 - Kaazing Corporation. All rights reserved.
111.
PostMessage API The
PostMessage API can be used for communicating between documents with the same origin PostMessage provides asynchronous message passing between JavaScript contexts. Useful when communication might otherwise be disallowed by the same-domain policy Also provides a consistent, easy-to-use API Also used in other HTML5 APIs for communication between JavaScript contexts, for example in HTML5 Web Workers Copyright © 2010 - Kaazing Corporation. All rights reserved.
112.
Using the PostMessage
API Copyright © 2010 - Kaazing Corporation. All rights reserved.
113.
Using the PostMessage
API JavaScript //Sending a message: myFrame.contentWindow.postMessage('Hello, world', 'http://www.example.com/'); Copyright © 2010 - Kaazing Corporation. All rights reserved.
114.
Using the PostMessage
API JavaScript //Listening for messages: window.addEventListener(“message”, messageHandler, true); function messageHandler(e) { switch(e.origin) { case “friend.example.com”: // process message processMessage(e.data); break; default: // message origin not recognized // ignoring message } } Copyright © 2010 - Kaazing Corporation. All rights reserved.
115.
Browser Support for
Cross Document Messaging Chrome 2.0+ Firefox 3.5+ IE 8.0+ Opera 9.6+ Safari 4.0+ Copyright © 2010 - Kaazing Corporation. All rights reserved.
116.
XMLHttpRequest Level 2
XMLHttpRequest Level 2 XMLHttpRequest is the API that made Ajax possible XMLHttpRequest Level 2 significantly enhances XMLHttpRequest Progress events Cross-origin XMLHttpRequest XMLHttpRequest Level 2 allows for cross-origin XMLHttpRequests using Cross Origin Resource Sharing (CORS) http://www.w3.org/TR/access-control/ Copyright © 2010 - Kaazing Corporation. All rights reserved.
117.
Cross-origin HTTP requests
Cross-origin HTTP requests have an Origin header that provides the server with the request’s origin This header is protected by the browser and cannot be changed from application code In essence, a network equivalent of the origin property found on message events used in Cross Document Messaging. The origin header differs from the older referer [sic] header in that the referer is a complete URL including the path Copyright © 2010 - Kaazing Corporation. All rights reserved.
118.
Origin and Referer
(Request) JavaScript POST /main HTTP/1.1 Host: www.example.net User-Agent: Mozilla/5.0 (X11; U; Linux x86_64; en-US; rv:1.9.1.3) Gecko/20090910 Ubuntu/9.04 (jaunty) Shiretoko/3.5.3 Accept: text/html,application/xhtml+xml,application/xml;q=0.9,*/*;q=0.8 Accept-Language: en-us,en;q=0.5 Accept-Encoding: gzip,deflate Accept-Charset: ISO-8859-1,utf-8;q=0.7,*;q=0.7 Keep-Alive: 300 Connection: keep-alive Referer: http://www.example.com/path Origin: http://www.example.com Pragma: no-cache Copyright © 2010 - Kaazing Corporation. All rights reserved.
119.
Origin and Referer
(Response) JavaScript HTTP/1.1 201 Created Transfer-Encoding: chunked Server: Kaazing Gateway Date: Mon, 02 Nov 2009 06:55:08 GMT Content-Type: text/plain Access-Control-Allow-Origin: http://www.example.com Access-Control-Allow-Credentials: true Copyright © 2010 - Kaazing Corporation. All rights reserved.
120.
Progress Events One
of the most important API improvements in XMLHttpRequest have been the changes related to progressive responses Before XHR Level 2: There was only a single readystatechange event Inconsistently implemented across browsers (for example, readyState 3 (progress) never fires in Internet Explorer) Lacked a way to communicate upload progress. Implementing (for example, building an upload progress bar was not a trivial task) Copyright © 2010 - Kaazing Corporation. All rights reserved.
121.
122.
Using the XMLHttpRequest
API Copyright © 2010 - Kaazing Corporation. All rights reserved.
123.
124.
125.
Browser Support for
XMLHttpRequest Level 2 Chrome 2.0+ Firefox 3.5+ Safari 4.0+ Note: some server side participation may be required (CORS) Copyright © 2010 - Kaazing Corporation. All rights reserved.
126.
HTML5Server-Sent Events Copyright
© 2010 - Kaazing Corporation. All rights reserved.
127.
Server-Sent Events Server-Sent
Events (SSE) standardizes and formalizes how a continuous stream of data can be sent from a server to a browser Effectively standardizes Comet and Reverse Ajax EventSource API for broadcasting data from server to client SSE is compatible with almost any setup that uses HTTP today (WebSocket requires that intermediaries support full-duplex connections) Copyright © 2010 - Kaazing Corporation. All rights reserved.
128.
Server-Sent Events Server-Sent
features Reconnection Event IDs Ability to send arbitrary events Server-Sent Events can be used for automated data push mechanisms (for example, updating Web Storage) Copyright © 2010 - Kaazing Corporation. All rights reserved.
129.
SSE Architecture Copyright
© 2010 - Kaazing Corporation. All rights reserved.
130.
Using the EventSource
API Copyright © 2010 - Kaazing Corporation. All rights reserved.
131.
Using the EventSource
API JavaScript //Connects to a server URL to receive an event stream:var stream = new EventSource("http://news.kaazing.com"); Set event handlers: stream.onopen = function() { alert(“open”); } stream.onmessage = function(event) { alert(“message: “ + event.data); } stream.onerror = function() { alert(“error”); } Copyright © 2010 - Kaazing Corporation. All rights reserved.
132.
Example: News Broadcast
http://kaazing.me/ Copyright © 2010 - Kaazing Corporation. All rights reserved.
133.
Browser Support for
Server-Sent Events Opera 9.0+ partial support Development in Firefox Trunk Dev channel Copyright © 2010 - Kaazing Corporation. All rights reserved.
134.
Q&A Copyright ©
2010 - Kaazing Corporation. All rights reserved.
135.
SF JUG HTML5
Meeting Special! Copyright © 2010 - Kaazing Corporation. All rights reserved. HTML5ROCKS 10% Off Any HTML5 Training With Coupon Code HTML5ROCKS http://tech.kaazing.com/training/index.html
136.
Copyright © 2010
Kaazing Corporation, All rights reserved. All materials, including labs and other handouts are property of Kaazing Corporation. Except when expressly permitted by Kaazing Corporation, you may not copy, reproduce, publish, or display any part of this training material, in any form, or by any means. Copyright © 2010 - Kaazing Corporation. All rights reserved.
Notas del editor
WebSocket is text-only
Cross-site scripting error in earlier version of Firefox and Firebug
Because the path may contain sensitive information, the referer is sometimes not sent by browsers attempting to protect user privacy.
Descargar ahora