Elbert Bae
Elbert Bae

Reputation: 231

NestJs GraphQL playground access

I can't seem to access the GraphQL Playground using NestJS. I'm exploring the documentation and have followed this https://docs.nestjs.com/graphql/quick-start up to the Resolvers section to generate the schema.gql, but attempting to reach localhost:3000/graphql is not able to connect.

At first I thought my code was setup incorrectly, but I spent some time digging into Nest's examples and found that those also do not work when trying to access the /graphql endpoint. It does work if I setup a get endpoint to return a JSON body using the REST method.

import { Module } from '@nestjs/common';
import { GraphQLModule } from '@nestjs/graphql';
import { RecipesModule } from './recipes/recipes.module';

@Module({
  imports: [
    RecipesModule,
    GraphQLModule.forRoot({
      installSubscriptionHandlers: true,
      autoSchemaFile: 'schema.gql',
    }),
  ],
})
export class AppModule {}

This is directly from the NestJS example. My understanding is that the GraphQLModule should be setting up the connection to the /graphql endpoint. Following the docs, graphql, apollo-server-express, and graphql-tools were all installed.

Any idea why the graphql route is not connecting?

[Edit]: Things I've tried so far:

Upvotes: 8

Views: 11389

Answers (6)

mondyfy
mondyfy

Reputation: 534

Still have the same issue with helmet, I just checked the environment and used it conditionally, and it worked for me:

const isGqlEnvProd = process.env.GQL_ENV === 'prod';
if(isGqlEnvProd){
 app.use(helmet());
}

Upvotes: 0

Commodore64
Commodore64

Reputation: 102

2 years late but found a simple workaround, since helmet was the issue too.
Conditionally use helmet(), like this:

process.env.CURRENT_ENV === 'dev' && app.use(helmet())

Assuming CURRENT_ENV is a custom environment variable that I use instead of NODE_ENV.

Upvotes: 1

rotimi
rotimi

Reputation: 1

Removing the dist folder and restarting the app worked for me.

Upvotes: 0

IBRAHIM ALI MUSAH
IBRAHIM ALI MUSAH

Reputation: 979

sometimes helmet causes this same issue. if you have helmet loaded as a middleware, it might probably also cause this.

Upvotes: 10

Agent
Agent

Reputation: 1395

I encountered a similar issue this is what I did. I hope you will find it helpful. I appreciated everyone's support.

Step1: // app.module.ts

  imports: [
    UsersModule,
    GraphQLModule.forRoot({
      // autoSchemaFile: true,    did not work!
      autoSchemaFile: join(process.cwd(), 'src/schema.gql'),
      // schema.gql will automatically be created
      debug: true,
      playground: true,
    }),
  ],
  providers: [AppResolver],   // all resolvers & service should be in providers

step 2:

Make sure you have one at least query bcz Mutation is not enough if you don't GraphQL playground will not start. Read more here

Upvotes: 2

Elbert Bae
Elbert Bae

Reputation: 231

Seems to be an issue with WSL2 running on Windows 10. This thread on github has some insight into the issue.

Disable Fast Startup to allow access to localhost.

https://github.com/microsoft/WSL/issues/5298

Upvotes: -2

Related Questions