How to use @apollographql/graphql-playground-html - 9 common examples

To help you get started, we’ve selected a few @apollographql/graphql-playground-html examples, based on popular ways it is used in public projects.

Secure your code as it's written. Use Snyk Code to scan source code in minutes - no build needed - and fix issues immediately.

github terascope / teraslice / packages / data-access-plugin / src / dynamic-server / index.ts View on Github external
// but I don't think it needs any overriding
                const accept = accepts(req);
                const types = accept.types() as string[];
                const prefersHTML =
                types.find(
                    (x: string) => x === 'text/html' || x === 'application/json',
                ) === 'text/html';

                if (prefersHTML) {
                    const playgroundRenderPageOptions: PlaygroundRenderPageOptions = {
                        endpoint: path,
                        subscriptionEndpoint: this.subscriptionsPath,
                        ...this.playgroundOptions,
                    };
                    res.setHeader('Content-Type', 'text/html');
                    const playground = renderPlaygroundPage(playgroundRenderPageOptions);
                    res.write(playground);
                    res.end();
                    return;
                }
            }

            /* Not necessary, but removing to ensure schema built on the request */
            // tslint:disable-next-line
            const { schema, ...serverObj } = this;

            /**
             * This is the main reason to extend, to access graphqlExpress(),
             * to be able to modify the schema based on the request
             * It binds to our new object, since the parent accesses the schema
             * from this.schema etc.
             */
github alitelabs / tyx / src / core / graphql.ts View on Github external
//   schemaPath: "schema.graphql",
      //   extensions: {
      //     endpoints: {
      //       dev: {
      //         url: `${this.config.prefix || ''}/graphql`,
      //         headers: {
      //           Authorization: `Bearer ${ctx.auth.token}`
      //         }
      //       }
      //     }
      //   }
      // },
      ...custom
    });
    if (options.tabs) options.tabs.forEach(tab => tab.endpoint = options.endpoint);
    return renderPlaygroundPage(options || options);
  }
github apollographql / apollo-server / packages / apollo-server-koa / src / ApolloServer.ts View on Github external
// perform more expensive content-type check only if necessary
          const accept = accepts(ctx.req);
          const types = accept.types() as string[];
          const prefersHTML =
            types.find(
              (x: string) => x === 'text/html' || x === 'application/json',
            ) === 'text/html';

          if (prefersHTML) {
            const playgroundRenderPageOptions: PlaygroundRenderPageOptions = {
              endpoint: path,
              subscriptionEndpoint: this.subscriptionsPath,
              ...this.playgroundOptions,
            };
            ctx.set('Content-Type', 'text/html');
            const playground = renderPlaygroundPage(
              playgroundRenderPageOptions,
            );
            ctx.body = playground;
            return;
          }
        }

        return graphqlKoa(() => {
          return this.createGraphQLServerOptions(ctx);
        })(ctx, next);
      }),
    );
github keystonejs / keystone / packages / app-graphql-playground / index.js View on Github external
app.get(graphiqlPath, (req, res) => {
      const tab = { endpoint };
      if (req.query && req.query.query) {
        tab.query = req.query.query;
        tab.variables = req.query.variables;
      }

      res.setHeader('Content-Type', 'text/html');
      res.write(
        renderPlaygroundPage({
          endpoint,
          version: playgroundPkg.version,
          tabs: [tab],
          settings: { 'request.credentials': 'same-origin' },
        })
      );
      res.end();
    });
github apollographql / apollo-server / packages / apollo-server-lambda / src / ApolloServer.ts View on Github external
if (this.playgroundOptions && event.httpMethod === 'GET') {
        const acceptHeader = event.headers['Accept'] || event.headers['accept'];
        if (acceptHeader && acceptHeader.includes('text/html')) {
          const path =
            event.path ||
            (event.requestContext && event.requestContext.path) ||
            '/';

          const playgroundRenderPageOptions: PlaygroundRenderPageOptions = {
            endpoint: path,
            ...this.playgroundOptions,
          };

          return callback(null, {
            body: renderPlaygroundPage(playgroundRenderPageOptions),
            statusCode: 200,
            headers: {
              'Content-Type': 'text/html',
              ...requestCorsHeadersObject,
            },
          });
        }
      }

      const callbackFilter: APIGatewayProxyCallback = (error, result) => {
        callback(
          error,
          result && {
            ...result,
            headers: {
              ...result.headers,
github apollographql / apollo-server / packages / apollo-server-hapi / src / ApolloServer.ts View on Github external
const types = accept.mediaTypes as string[];
          const prefersHTML =
            types.find(
              (x: string) => x === 'text/html' || x === 'application/json',
            ) === 'text/html';

          if (prefersHTML) {
            const playgroundRenderPageOptions: PlaygroundRenderPageOptions = {
              endpoint: path,
              subscriptionEndpoint: this.subscriptionsPath,
              version: this.playgroundVersion,
              ...this.playgroundOptions,
            };

            return h
              .response(renderPlaygroundPage(playgroundRenderPageOptions))
              .type('text/html')
              .takeover();
          }
        }
        return h.continue;
      }.bind(this),
    });
github icebob / kantab / backend / mixins / apollo-server-moleculer / ApolloServer.js View on Github external
handleGraphqlRequestsWithPlayground({ req, res, }) {
		let handled = false;
		if (this.playgroundOptions && req.method === "GET") {
			const { mediaTypes } = accept.parseAll(req.headers);
			const prefersHTML = mediaTypes.find((x) => x === "text/html" || x === "application/json") === "text/html";

			if (prefersHTML) {
				const middlewareOptions = Object.assign({ endpoint: this.graphqlPath, subscriptionEndpoint: this.subscriptionsPath }, this.playgroundOptions);
				send(res, 200, renderPlaygroundPage(middlewareOptions), "text/html");
				handled = true;
			}
		}
		return handled;
	}
github apollographql / apollo-server / packages / apollo-server-azure-functions / src / ApolloServer.ts View on Github external
status: 204,
          headers: corsHeaders,
        });
        return;
      }

      if (this.playgroundOptions && req.method === 'GET') {
        const acceptHeader = req.headers['Accept'] || req.headers['accept'];
        if (acceptHeader && acceptHeader.includes('text/html')) {
          const path = req.url || '/';

          const playgroundRenderPageOptions: PlaygroundRenderPageOptions = {
            endpoint: path,
            ...this.playgroundOptions,
          };
          const body = renderPlaygroundPage(playgroundRenderPageOptions);
          context.done(null, {
            body: body,
            status: 200,
            headers: {
              'Content-Type': 'text/html',
              ...corsHeaders,
            },
          });
          return;
        }
      }

      const callbackFilter = (error?: any, output?: HttpResponse) => {
        context.done(
          error,
          output && {
github apollographql / apollo-server / packages / apollo-server-fastify / src / ApolloServer.ts View on Github external
const accept = (req as any).accepts() as Accepts;
                const types = accept.types() as string[];
                const prefersHTML =
                  types.find(
                    (x: string) =>
                      x === 'text/html' || x === 'application/json',
                  ) === 'text/html';

                if (prefersHTML) {
                  const playgroundRenderPageOptions: PlaygroundRenderPageOptions = {
                    endpoint: this.graphqlPath,
                    subscriptionEndpoint: this.subscriptionsPath,
                    ...this.playgroundOptions,
                  };
                  reply.type('text/html');
                  const playground = renderPlaygroundPage(
                    playgroundRenderPageOptions,
                  );
                  reply.send(playground);
                  return;
                }
              }
              done();
            },
          ];

@apollographql/graphql-playground-html

GraphQL IDE for better development workflows (GraphQL Subscriptions, interactive docs & collaboration).

MIT
Latest version published 3 years ago

Package Health Score

77 / 100
Full package analysis

Popular @apollographql/graphql-playground-html functions