Introduction to WebSockets

---

WebSocket is an application layer protocol that enables two-way communication between WebSocket clients and WebSocket servers. Comprehending how WebSockets work and how their connections are established will help us identify vulnerabilities that may arise in web applications utilizing them.

---

What are WebSockets?

Typically, a browser communicates with a web server using HTTP. Before HTTP/2, servers could only send data in response to a client's request; therefore, versions HTTP/1.1 and prior provided servers no means of pushing data to clients unconditionally. However, a feature known as Server Push in HTTP/2 allows servers to send resources proactively, without a prior client request. Instead of using the request-response paradigm, the WebSocket protocol allows for full-duplex (i.e., bi-directional) message transmissions between servers and clients without any prior request from the other party. Such WebSocket connections typically remain open for an extended period and allow for data transmission anytime in any direction.

For example, let's consider a simple HTTP/1.1 chat room web application running in the browser of two participants, Alice and Bob. When Alice sends a message to Bob, her browser transmits the message to the web server; however, the web server will not be able to send the message to Bob simultaneously because it cannot send a message without a prior request. Thus, Bob's browser must periodically poll the web server for new messages from Alice, and depending on the number of messages transmitted to Bob, this mechanism creates much traffic and could be inefficient.

Suppose the same application uses WebSocket connections instead. In that case, Alice and Bob will establish a WebSocket connection with the web server upon login. Afterward, Alice's browser will simultaneously transmit her messages to Bob via the WebSocket connection without polling requests. Thus, WebSockets are highly advantageous for real-time applications.

WebSocket connections can be identified by the ws:// and wss:// protocol schemes. ws:// is used for WebSocket communication over an unencrypted/insecure HTTP connection, whereas wss:// is used for WebSocket communication over a secure/encrypted HTTPS connection. Connections to both HTTP and HTTPS servers can establish WebSocket connections. However, when connecting to an HTTP server, the WebSocket connection is typically considered insecure (ws://) because it does not use encryption. On the other hand, when connecting to an HTTPS server, the WebSocket connection should be established securely (wss://) to ensure data encryption and security.

---

WebSocket Connection Establishment

WebSocket connections begin with an initial handshake process, which involves an exchange of specific messages between the client and server to upgrade the connection from HTTP to WebSocket.

Web browser can attempt to establish WebSocket connections via multiple means; for example, they can use the JavaScript client-side WebSocket object:

const socket = new WebSocket('ws://websockets.htb/echo');

The WebSocket handshake is initiated with an HTTP request similar to this:

GET /echo HTTP/1.1
Host: websockets.htb
Connection: Upgrade
Upgrade: websocket
Sec-WebSocket-Version: 13
Sec-WebSocket-Key: 7QpTshdCiQfiv3tH7myJ1g==
Origin: http://websockets.htb

It contains the following important headers:

• The Connection header with the value Upgrade and the Upgrade header with the value websocket indicate the client's intent to establish a WebSocket connection
• The Sec-WebSocket-Version header contains the WebSocket protocol version chosen by the client, with the latest version being 13
• The Sec-WebSocket-Key header contains a unique value confirming that the client wants to establish a WebSocket connection; this header does not provide any security protections
• The Origin header contains the origin just like in regular HTTP requests and is used for security purposes, as we will discuss in a later section

The server responds with a response similar to the following:

HTTP/1.1 101 Switching Protocols
Connection: Upgrade
Upgrade: websocket
Sec-WebSocket-Accept: QU/gD/2y41z9ygrOaGWgaC+Pm2M=

The response contains the following information:

• The HTTP status code of 101 indicates that the WebSocket connection establishment has been completed
• The Connection and Upgrade headers contain the same values as in the client's request, which is Upgrade and websocket, respectively
• The Sec-WebSocket-Accept header contains a value derived from the value sent by the client in the Sec-WebSocket-Key header and confirms that the server is willing to establish a WebSocket connection

After the server's response, the WebSocket connection has been established, and messages can be exchanged.

For more details on how to build web applications with WebSockets, check out the WebSocket handbook.