🎉 Requestly joins BrowserStack to build the future of application testing. Read more

HTTP Headers

Sec WebSocket Protocol

HTTP Header

The HTTP Sec-WebSocket-Protocol request and response headers are used during the WebSocket opening handshake to negotiate a sub-protocol to be used for communication. This can be a well-known protocol such as SOAP or WAMP, or a custom protocol understood by both the client and server.

In a request, the header specifies one or more WebSocket sub-protocols that the web application prefers, listed in order of priority.
These protocols can be included as multiple header values or as comma-separated values within a single header.

In a response, it indicates the sub-protocol selected by the server.
This must be the first supported sub-protocol from the list provided in the request header.

The request header is automatically added and populated by the browser based on the protocols argument passed to the WebSocket() constructor.
The sub-protocol chosen by the server becomes accessible to the web application via WebSocket.protocol.

Syntax

Request:

Sec-WebSocket-Protocol: <sub-protocols>

Response:

Sec-WebSocket-Protocol: <selected-sub-protocol>

Directives

Sub-protocols are specified as a comma-separated list of names, arranged in order of preference. The names can be chosen from the IANA WebSocket Subprotocol Name Registry or can be custom names agreed upon by both the client and the server.

Example

The sub-protocol is specified in the original WebSocket handshake request.
The request below shows that the client prefers soap, but also supports wamp.

GET /chat HTTP/1.1
host: example.com:8000
Upgrade: websocket
Connection: Upgrades
Sec-WebSocket-Key: dGhlIHNhbXBsZSBub25jZQ==
Sec-WebSocket-Version: 13
Sec-WebSocket-Protocol: soap, wamp

Specifying the protocols like this has the same effect:

Sec-WebSocket-Protocol: soap
Sec-WebSocket-Protocol: wamp

The response from the server will include the Sec-WebSocket-Protocol header, selecting the first sub-protocol that it supports from the client’s preferences.
Below that is shown as soap:

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

How to Modify Header using Requestly

Requestly is a powerful Chrome extension that allows you to modify HTTP headers, including the Sec-WebSocket-Protocol header.
Modifying this header is helpful when you want to test or customize WebSocket subprotocol negotiation between a client and server during development or troubleshooting. Steps to Modify the Sec-WebSocket-Protocol Header:

  1. Install and open the Requestly Chrome extension. You can find it on the Chrome Web Store.
  2. Create a new rule: Click on “Create Rule” and choose “Modify Headers” from the list of available rule types.
  3. Add a new header modification:
    • Under “Action”, select “Add” or “Override”.
    • In the “Header Name” field, enter Sec-WebSocket-Protocol.
    • In the “Header Value” field, enter your desired subprotocol(s) (e.g., chat, superchat).
  4. Set the URL condition: Specify the URL or pattern where this header change should apply (e.g., wss://your-websocket-server.com/*).
  5. Save the rule.

Once set up, Requestly will modify the Sec-WebSocket-Protocol header in all matching WebSocket connection requests, allowing you to simulate different subprotocol negotiations and verify how your server handles them.