HTTP headers in Websockets client API

by

Updated 2x

Short answer: No, only the path and protocol field can be specified.

Longer answer:

There is no method in the JavaScript WebSockets API for specifying additional headers for the client/browser to send. The HTTP path (“GET /xyz”) and protocol header (“Sec-WebSocket-Protocol”) can be specified in the WebSocket constructor.

The Sec-WebSocket-Protocol header (which is sometimes extended to be used in websocket specific authentication) is generated from the optional second argument to the WebSocket constructor:

var ws = new WebSocket("ws://example.com/path", "protocol");
var ws = new WebSocket("ws://example.com/path", ["protocol1", "protocol2"]);

The above results in the following headers:

Sec-WebSocket-Protocol: protocol

and

Sec-WebSocket-Protocol: protocol1, protocol2

A common pattern for achieving WebSocket authentication/authorization is to implement a ticketing system where the page hosting the WebSocket client requests a ticket from the server and then passes this ticket during WebSocket connection setup either in the URL/query string, in the protocol field, or required as the first message after the connection is established. The server then only allows the connection to continue if the ticket is valid (exists, has not been already used, client IP encoded in ticket matches, timestamp in ticket is recent, etc). Here is a summary of WebSocket security information: https://devcenter.heroku.com/articles/websocket-security

Basic authentication was formerly an option but this has been deprecated and modern browsers don’t send the header even if it is specified.

Basic Auth Info (Deprecated – No longer functional):

NOTE: the following information is no longer accurate in any modern browsers.

The Authorization header is generated from the username and password (or just username) field of the WebSocket URI:

var ws = new WebSocket("ws://username:[email protected]")

The above results in the following header with the string “username:password” base64 encoded:

Authorization: Basic dXNlcm5hbWU6cGFzc3dvcmQ=

I have tested basic auth in Chrome 55 and Firefox 50 and verified that the basic auth info is indeed negotiated with the server (this may not work in Safari).

Thanks to Dmitry Frank’s for the basic auth answer

More Related Contents:

  1. Accessing partial response using AJAX or WebSockets?
  2. In what situations would AJAX long/short polling be preferred over HTML5 WebSockets?
  3. Response to preflight request doesn’t pass access control check
  4. What browsers support HTML5 WebSocket API?
  5. Make a link use POST instead of GET
  6. Send message to specific client with socket.io and node.js
  7. Set a cookie to HttpOnly via Javascript
  8. How to Use Sockets in JavaScript\HTML? [closed]
  9. How do I access the HTTP request header fields via JavaScript?
  10. Check if my website is open in another tab
  11. Do websockets allow for p2p (browser to browser) communication?
  12. How to maintain a WebSockets connection between pages?
  13. Socket.io 1.x: use WebSockets only?
  14. angular 2 disable url encoding
  15. Sending websocket ping/pong frame from browser
  16. How to intercept all http requests including form submits
  17. shorthand http:// as // for script and link tags? anyone see / use this before?
  18. Download text/csv content as files from server in Angular
  19. Firefox setting to enable cross domain Ajax request
  20. Video streaming over websockets using JavaScript
  21. For a push notification, is a websocket mandatory?
  22. fetch() does not send headers?
  23. How to get data out of a Node.js http get request
  24. Cross-domain connection in Socket.IO
  25. What does “WebSocket is closed before the connection is established” mean?
  26. Large file upload with WebSocket
  27. Do Shared Web Workers persist across a single page reload, link navigation
  28. AngularJS and WebSockets beyond
  29. Silence net::ERR_CONNECTION_REFUSED
  30. Reading from udp port in browser

Leave a Comment