Get started with GraphQL Yoga v3
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
yarn add @graphql-yoga/common graphql
Example with Regular fetch
Event Listener
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
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.