Laravel GraphQL Playground

Deprecated

This project is deprecated in favor of mll-lab/laravel-graphiql.

Easily integrate GraphQL Playground into your Laravel projects.

Please note: This is not a GraphQL Server implementation, only a UI for testing and exploring your schema. For the server component we recommend nuwave/lighthouse.

Installation

composer require mll-lab/laravel-graphql-playground

If you are using Lumen, register the service provider in bootstrap/app.php

$app->register(MLL\GraphQLPlayground\GraphQLPlaygroundServiceProvider::class);

Configuration

By default, the playground is reachable at /graphql-playground and assumes a running GraphQL endpoint at /graphql.

To change the defaults, publish the configuration with the following command:

php artisan vendor:publish --tag=graphql-playground-config

You will find the configuration file at config/graphql-playground.php.

Lumen

If you are using Lumen, copy it into that location manually and load the configuration in your boostrap/app.php:

$app->configure('graphql-playground');

HTTPS behind proxy

If your application sits behind a proxy which resolves https, the generated URL for the endpoint might not use https://, thus causing the Playground to not work by default. In order to solve this, configure your TrustProxies middleware to contain \Symfony\Component\HttpFoundation\Request::HEADER_X_FORWARDED_FOR in $headers.

Customization

To customize the Playground even further, publish the view:

php artisan vendor:publish --tag=graphql-playground-view

You can use that for all kinds of customization.

Change settings of the playground instance

Add extra settings in the call to GraphQLPlayground.init in the published view:

GraphQLPlayground.init(document.getElementById('root'), {
  endpoint: "{{ url(config('graphql-playground.endpoint')) }}",
  subscriptionEndpoint: "{{ config('graphql-playground.subscriptionEndpoint') }}",
  // See https://github.com/graphql/graphql-playground#properties for available settings
})

Configure session authentication

Session based authentication can be used with Laravel Sanctum. If you use GraphQL through sessions and CSRF, add the following to the <head> in the published view:

<meta name="csrf-token" content="{{ csrf_token() }}">

Modify the Playground config:

GraphQLPlayground.init(document.getElementById('root'), {
  endpoint: "{{ url(config('graphql-playground.endpoint')) }}",
  subscriptionEndpoint: "{{ config('graphql-playground.subscriptionEndpoint') }}",
+ settings: {
+   'request.credentials': 'same-origin',
+   'request.globalHeaders': {
+     'X-CSRF-TOKEN': document.querySelector('meta[name="csrf-token"]').content
+   }
+ }
})

Make sure your route includes the web middleware group in config/graphql-playground.php:

    'route' => [
        'uri' => '/graphql-playground',
        'name' => 'graphql-playground',
+       'middleware' => ['web']
    ]

Local assets

If you want to serve the assets from your own server, you can download them with the command

php artisan graphql-playground:download-assets

This puts the necessary CSS, JS and Favicon into your public directory. If you have the assets downloaded, they will be used instead of the online version from the CDN.

Security

If you do not want to enable the GraphQL playground in production, you can disable it in the config file. The easiest way is to set the environment variable GRAPHQL_PLAYGROUND_ENABLED=false.

If you want to protect the route to the GraphQL playground, you can add custom middleware in the config file.

Project Name	Stars	Repos Using This	Packages Using This	Most Recent Commit	Total Releases	Latest Release	Open Issues	License	Language
Lighthouse	3,139	46	49	7 hours ago	281	September 19, 2022	124	mit	PHP
A framework for serving GraphQL from Laravel
Cms	2,566	3	107	5 hours ago	230	September 27, 2022	482	other	PHP
The core Laravel CMS Composer package
Graphql Laravel	1,957	32	9	3 days ago	133	June 11, 2022	14	mit	PHP
Laravel wrapper for Facebook's GraphQL
Laravel Graphql	1,783	72	11	4 years ago	65	February 10, 2019	125		PHP
Facebook GraphQL for Laravel 5. It supports Relay, eloquent models, validation and GraphiQL.
Badaso	1,039			3 days ago	99	June 23, 2022	3	mit	Vue
Laravel Vue headless CMS / admin panel / dashboard / builder / API CRUD generator, anything !
Graphqlite	521	16	12	6 days ago	20	June 15, 2022	47	mit	PHP
Use PHP Attributes/Annotations to declare your GraphQL API
Laravel Vue Boilerplate	482			2 years ago				mit	PHP
:elephant: A Laravel 8 SPA boilerplate with a users CRUD using Vue.js 2.6, GraphQL, Bootstrap 4, TypeScript, Sass, and Pug.
Laravel Graphql Playground	271	17	7	2 months ago	21	February 01, 2021		mit	PHP
This project is deprecated in favor of https://github.com/mll-lab/laravel-graphiql.
Resources I Like	265			3 years ago			3
:books::100: Collection of learning resources i like
Lighthouse Graphql Passport Auth	217	3		7 days ago	45	June 17, 2021		mit	PHP
Add GraphQL mutations to get tokens from passport for https://lighthouse-php.com/

Laravel Graphql Playground