Catch the highlights of GraphQLConf 2023!Click for recordings.Or check out our recap blog post.
v5 (latest)
Features
CSRF Prevention

CSRF Prevention

If you have CORS enabled, almost all requests coming from the browser will have a preflight request - however, some requests are deemed "simple" and don't make a preflight. One example of such a request is a good ol' GET request without any headers, this request can be marked as "simple" and have preflight CORS checks skipped therefore skipping the CORS check.

This attack can be mitigated by saying: "all GET requests must have a custom header set". This would force all clients to manipulate the headers of GET requests, marking them as "_not-_simple" and therefore always executing a preflight request. Apollo does this when using the csrfPrevention = true option (opens in a new tab).

By using the @graphql-yoga/plugin-csrf-prevention GraphQL Yoga plugin, you can achieve the same!

Installation

npm i @graphql-yoga/plugin-csrf-prevention

Quick Start

import { createSchema, createYoga } from 'graphql-yoga'
import { useCSRFPrevention } from '@graphql-yoga/plugin-csrf-prevention'
 
const schema = createSchema({
  typeDefs: `
    type Query {
      hello: String!
    }
  `,
  resolvers: {
    Query: {
      hello() {
        return 'world'
      }
    }
  }
})
 
const yoga = createYoga({
  schema,
  plugins: [
    useCSRFPrevention({
      requestHeaders: ['x-graphql-yoga-csrf'] // default
    })
  ]
})