Integration with Express

Express is the most popular web framework for Node.js. It is a minimalist framework that provides a robust set of features to handle HTTP on Node.js applications. You can easily integrate Hive Gateway into your Express application with a few lines of code.

Example

import express from 'express'
import { createGatewayRuntime } from '@graphql-hive/gateway-runtime'
 
const app = express()
 
const serveRuntime = createGatewayRuntime(/* Your configuration */)
 
// Bind Hive Gateway to the graphql endpoint to avoid rendering the playground on any path
app.use(serveRuntime.graphqlEndpoint, serveRuntime)
 
app.listen(4000, () => {
  console.log('Running a GraphQL API server at http://localhost:4000/graphql')
})

Using Helmet

If you are using Helmet to set your Content Security Policy, you can use the following configuration:

app.use(
  helmet({
    contentSecurityPolicy: {
      directives: {
        'style-src': ["'self'", 'unpkg.com'],
        'script-src': ["'self'", 'unpkg.com', "'unsafe-inline'"],
        'img-src': ["'self'", 'raw.githubusercontent.com']
      }
    }
  })
)

Isolate GraphiQL configuration

To avoid applying this configuration to other endpoints you may have on your Express server, you can use Express.Router to create a new router instance and apply the configuration only to the Hive Gateway endpoint.

import express from 'express'
import helmet from 'helmet'
import { createGatewayRuntime } from '@graphql-hive/gateway-runtime'
 
const app = express()
 
const serveRuntime = createGatewayRuntime(/* Your configuration */)
const hiveGWRouter = express.Router()
// GraphiQL specefic CSP configuration
hiveGWRouter.use(
  helmet({
    contentSecurityPolicy: {
      directives: {
        'style-src': ["'self'", 'unpkg.com'],
        'script-src': ["'self'", 'unpkg.com', "'unsafe-inline'"],
        'img-src': ["'self'", 'raw.githubusercontent.com']
      }
    }
  })
)
hiveGWRouter.use(serveRuntime)
 
// By adding the Hive Gateway router before the global helmet middleware,
// you can be sure that the global CSP configuration will not be applied to the Hive Gateway endpoint
app.use(serveRuntime.graphqlEndpoint, hiveGWRouter)
 
// Add the global CSP configuration for the rest of your server.
app.use(helmet())
 
// You can know register your other endpoints that will not be affected by the GraphiQL CSP configuration
app.get('/hello', (req, res) => {
  res.send('Hello World!')
})
 
app.listen(4000, () => {
  console.log('Running a GraphQL API server at http://localhost:4000/graphql')
})