Best way to authorize a client started in a browser with the server

[airhorns]

Hi folks -- I'd like to protect my graphql-ws server from unauthorized access. For connections initiated from my own domain, I can use cookie authentication for this. The server side component has nice example in the readme that works fine.

I have run in to trouble when supporting connections initiated from other domains in the browser, or connections from other servers running nodejs. I have a pre-shared secret (an api key of sorts or a JWT, whatever floats your boat) that the JS on the other domain has access to and proves that that client should be able to start a connection, but I am wondering how you would recommend passing it to the server.

• Browsers don't let you set headers on websocket connections like you might with fetch, and they don't seem to send the Authorization header even if you connect to wss://user:pass@myserver.com
• Since the preshared secret is a secret, I'd prefer to not use a query param and thus logged in my logs / any load balancer logs

Is there an easy way to send a secret in one of the init messages in the graphql-ws protocol and have the server take a look at it when it comes in?

Thanks for any pointers you can give me!

[enisdenjo]

Hey there! The client connectionParams option is what you're seeking.

It allows you to pass a payload with the ConnectionInit message. ConnectionInit MUST be the first message that the connection transmits, and should therefore be used for authorization. In addition to this, there is a specific timeout within which the client MUST send this message to the server, if the server does not receive it in time - it will close the connection with a: 4408: Connection initialisation timeout. Read more about the ConnectionInit message in the Protocol.

On the server-side, use the onConnect option to authenticate the connection and respond accordingly.