Skip to content


Repository files navigation

GraphiQL-Rails Gem Version Tests

Mount the GraphiQL IDE in Ruby on Rails.



Add to your Gemfile:

bundle add graphiql-rails

Additionally, you'll need Sprockets or Propshaft to serve the JS and CSS assets.


Mount the Engine

Add the engine to routes.rb:

# config/routes.rb
Rails.application.routes.draw do
  # ...
  if Rails.env.development?
    mount GraphiQL::Rails::Engine, at: "/graphiql", graphql_path: "/your/endpoint"
  • at: is the path where GraphiQL will be served. You can access GraphiQL by visiting that path in your app.
  • graphql_path: is the path to the GraphQL endpoint. GraphiQL will send queries to this path.

Sprockets or Propshaft

You'll need Sprockets or Propshaft to deliver the JS and CSS for GraphiQL. If you don't already have one of those, you can add them with:

$ bundle add sprockets-rails
# or
$ bundle add propshaft

API Mode

If you're using Rails 6+ in "API mode", you'll also need to do the following:

  1. Add require "sprockets/railtie" to your application.rb.

  2. Create an app/assets/config/manifest.js file and add the following:

//= link graphiql/rails/application.css
//= link graphiql/rails/application.js


You can override GraphiQL::Rails.config values in an initializer (eg, config/initializers/graphiql.rb). The configs are:

  • query_params (boolean, default false): if true, the GraphQL query string will be persisted the page's query params

  • initial_query (string, default nil): if provided, it will be rendered in the query pane for a visitor's first visit

  • title (string, default nil): if provided, it will be rendered in the page <title> tag

  • logo (string, default nil): if provided, it will be the text logo

  • csrf (boolean, default true): include X-CSRF-Token in GraphiQL's HTTP requests

  • header_editor_enabled (boolean, default false): if provided, the header editor will be rendered

  • headers (hash, String => Proc): procs to fetch header values for GraphiQL's HTTP requests, in the form (view_context) -> { ... }. For example:

    GraphiQL::Rails.config.headers['Authorization'] = -> (context) { "bearer #{context.cookies['_graphql_token']}" }
  • input_value_deprecation (boolean, default false): if provided, the deprecated arguments will be rendered


  • Tests: rake test
  • Update GraphiQL & dependencies: rake update_graphiql