Skip to content

enisdenjo/cloudflare-worker-graphql-ws-template

Repository files navigation

A template for WebSockets powered Cloudflare Worker project using graphql-ws.

The worker serves the following routes:

  • "/" renders GraphiQL using only graphql-ws (as showcased here)
  • "/graphql" serves the GraphQL over WebSocket

Getting started

This template is meant to be used with Wrangler. If you are not already familiar with the tool, we recommend that you install the tool and configure it to work with your Cloudflare account. Documentation can be found here.

To generate using Wrangler, run this command:

wrangler generate my-graphql-ws https://github.com/enisdenjo/cloudflare-worker-graphql-ws-template

Gotchas

  • Server WebSocket instance does not contain the protocol property (as ws does) which is why you should pass the Sec-WebSocket-Protocol header to the graphql-ws server

  • Message listener event data property is already a string

  • If the client does not support the "graphql-transport-ws" subprotocol, the Sec-WebSocket-Protocol header will be omitted. This causes Chrome to abruptly terminate the connection with a 1006 close event code.

  • webpack.config.js is configured to omit the browser entry field in package.jsons since we are bundling for Node workers and not for browsers

    This is especially necessary for graphql-ws since the browser bundle does NOT contain any server code.

Sponsor this project