⚠️

This is the documentation for the old GraphQL Yoga version 2. We recommend upgrading to the latest GraphQL Yoga version 5.

Migrate to GraphQL Yoga v5

Integration with Cloudflare Workers

GraphQL Yoga provides you a cross-platform GraphQL Server. So you can easily integrate it into any platform besides Node.js.

Cloudflare Workers provides a serverless execution environment that allows you to create entirely new applications or augment existing ones without configuring or maintaining infrastructure.

You will want to use the package @graphql-yoga/common which has an agnostic HTTP handler using Fetch API’s Request and Response objects when building GraphQL powered Cloudflare Workers.

💡

Watch Episode #48 of graphql.wtf for a quick introduction to using GraphQL Yoga with Cloudflare Workers, and KV:

Installation

Terminal

yarn add @graphql-yoga/common graphql

Example with Regular `fetch` Event Listener

listener.mjs

import { createServer } from '@graphql-yoga/common'
 
const server = createServer()
 
server.start()

💡

You can also check a full example on our GitHub repository here.

Example with Modules Approach

modules.mjs

import { createServer } from '@graphql-yoga/common'
 
export default createServer()

Access to environmental values (KV Namespaces etc.)

You can access your KV namespaces etc. through the context.

import { createServer } from '@graphql-yoga/common'
 
interface Env {
  MY_NAMESPACE: KVNamespace
}
 
export default createServer<Env>({
  typeDefs: /* GraphQL */ `
    type Query {
      todo(id: ID!): String
      todos: [String]
    }
    type Mutation {
      createTodo(id: ID!, text: String!): String
      deleteTodo(id: ID!): String
    }
  `,
  resolvers: {
    Query: {
      todo: (_, { id }, { MY_NAMESPACE }) => MY_NAMESPACE.get(id),
      todos: (_, _2, { MY_NAMESPACE }) => MY_NAMESPACE.list()
    },
    Mutation: {
      // MY_NAMESPACE is available as a GraphQL context
      createTodo(_, { id, text }, context) {
        return context.MY_NAMESPACE.put(id, text)
      },
      deleteTodo(_, { id }, context) {
        return context.MY_NAMESPACE.delete(id)
      }
    }
  }
})

If you need ExecutionContext as well inside your resolvers, you can set the context on your GraphQL server similar to what you see here:

import { createServer } from '@graphql-yoga/common'
 
interface Env {
  MY_NAMESPACE: KVNamespace
}
 
const yoga = createServer<{ env: Env; ctx: ExecutionContext }>()
 
export default {
  fetch(request: Request, env: Env, ctx: ExecutionContext) {
    return yoga.handleRequest(request, { env, ctx })
  }
}

💡

You can also check a full example on our GitHub repository here.

Enabling Subscriptions

To enable Server-Sent Events based subscriptions with Cloudflare Workers, you should add a compatibility flag in your wrangler configuration file like below:

compatibility_flags = ["streams_enable_constructors"]

Debug Logging

You should expose DEBUG variable in your environment to enable more verbose logging from GraphQL Yoga application.

AWS Lambda Deno