What Is Realtime? - Realtime Web Apps: With HTML5 WebSocket, PHP, and jQuery - page 10

According to the WHATWG, 15 the WebSocket protocol defines a standardized way to add realtime
communication in web applications:

The WebSocket protocol enables two-way communication between a user agent running untrusted code running
in a controlled environment to a remote host that has opted-in to communications from that code. The security
model used for this is the Origin-based security model commonly used by Web browsers. The protocol consists
of an initial handshake followed by basic message framing, layered over TCP. The goal of this technology is to
provide a mechanism for browser-based applications that need two-way communication with servers that does
not rely on opening multiple HTTP connections (e.g. using XMLHttpRequest or <iframe>s and long polling). 16

One of the most beneficial implications of widespread WebSocket support is in scalability: because WebSockets
use a single TCP connection for communication between the server and client instead of multiple, separate HTTP
requests, the overhead is dramatically reduced.

The WebSocket Protocol
Because full-duplex communication cannot be achieved using HTTP, WebSocket actually defines a whole new
protocol , or method of connecting to a server from a client.
This is accomplished by opening an HTTP request and then asking the server to “upgrade” the connection to the
WebSocket protocol by sending the following headers: 17

GET /chat HTTP/1.1
Host: server.example.com
Upgrade: websocket
Connection: Upgrade
Sec-WebSocket-Key: dGhlIHNhbXBsZSBub25jZQ==
Origin: http://example.com
Sec-WebSocket-Protocol: chat, superchat
Sec-WebSocket-Version: 13

If the request is successful, the server will return headers that look like these:

HTTP/1.1 101 Switching Protocols
Upgrade: websocket
Connection: Upgrade
Sec-WebSocket-Accept: s3pPLMBiTxaQ9kYGzzhZRbK+xOo=
Sec-WebSocket-Protocol: chat

This exchange is called a handshake , and it's required to establish a WebSocket connection. Once a successful
handshake occurs between the server and the client, a two-way communication channel is established, and both the
client and server can send data to each other independently.
Data sent after the handshake is enclosed in frames , which are essentially chunks of information. Each frame
starts with a 0x00 byte and ends with a 0xFF byte, meaning that every message sent has only two bytes of overhead in
addition to the message's size.

http://wiki.whatwg.org/wiki/FAQ#The_WHATWG
16 www.whatwg.org/specs/web-socket-protocol/
17

15

These example headers were borrowed from http://tools.ietf.org/html/rfc6455