本文整理匯總了TypeScript中@apollographql/graphql-playground-html.renderPlaygroundPage函數的典型用法代碼示例。如果您正苦於以下問題：TypeScript renderPlaygroundPage函數的具體用法？TypeScript renderPlaygroundPage怎麽用？TypeScript renderPlaygroundPage使用的例子？那麽, 這裏精選的函數代碼示例或許可以為您提供幫助。
在下文中一共展示了renderPlaygroundPage函數的8個代碼示例，這些例子默認根據受歡迎程度排序。您可以為喜歡或者感覺有用的代碼點讚，您的評價將有助於係統推薦出更棒的TypeScript代碼示例。
示例1: handleGraphqlRequestsWithPlayground
// If the `playgroundOptions` are set, register a `graphql-playground` instance
// (not available in production) that is then used to handle all
// incoming GraphQL requests.
private handleGraphqlRequestsWithPlayground({
req,
res,
}: {
req: MicroRequest;
res: ServerResponse;
}): boolean {
let handled = false;
if (this.playgroundOptions && req.method === 'GET') {
const accept = parseAll(req.headers);
const types = accept.mediaTypes as string[];
const prefersHTML =
types.find(
(x: string) => x === 'text/html' || x === 'application/json',
) === 'text/html';
if (prefersHTML) {
const middlewareOptions = {
endpoint: this.graphqlPath,
subscriptionEndpoint: this.subscriptionsPath,
...this.playgroundOptions,
};
send(res, 200, renderPlaygroundPage(middlewareOptions));
handled = true;
}
}
return handled;
}示例2: renderPlaygroundPage
(
req: FastifyRequest<IncomingMessage>,
reply: FastifyReply<OutgoingMessage>,
done: () => void,
) => {
// Note: if you enable playground in production and expect to be able to see your
// schema, you'll need to manually specify `introspection: true` in the
// ApolloServer constructor; by default, the introspection query is only
// enabled in dev.
if (this.playgroundOptions && req.req.method === 'GET') {
// perform more expensive content-type check only if necessary
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();
},示例3: middlewareFromPath
middlewareFromPath(path, (ctx: Koa.Context, next: Function) => {
if (ctx.request.method === 'OPTIONS') {
ctx.status = 204;
ctx.body = '';
return;
}
if (this.playgroundOptions && ctx.request.method === 'GET') {
// 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);
}),示例4: function
method: async function(request, h) {
if (request.path !== path) {
return h.continue;
}
if (this.uploadsConfig && typeof processFileUploads === 'function') {
await handleFileUploads(this.uploadsConfig)(request);
}
if (this.playgroundOptions && request.method === 'get') {
// perform more expensive content-type check only if necessary
const accept = parseAll(request.headers);
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),示例5: accepts
app.use(path, (req, res, next) => {
if (this.playgroundOptions && req.method === 'GET') {
// perform more expensive content-type check only if necessary
// XXX We could potentially move this logic into the GuiOptions lambda,
// 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;
}
}
return graphqlExpress(() => {
return this.createGraphQLServerOptions(req, res);
})(req, res, next);
});示例6: return
return (context: HttpContext, req: FunctionRequest) => {
if (cors && cors.origin) {
if (typeof cors.origin === 'string') {
corsHeaders['Access-Control-Allow-Origin'] = cors.origin;
} else if (
typeof cors.origin === 'boolean' ||
(Array.isArray(cors.origin) &&
cors.origin.includes(
req.headers['Origin'] || req.headers['origin'],
))
) {
corsHeaders['Access-Control-Allow-Origin'] =
req.headers['Origin'] || req.headers['origin'];
}
if (!cors.allowedHeaders) {
corsHeaders['Access-Control-Allow-Headers'] =
req.headers['Access-Control-Request-Headers'];
}
}
if (req.method === 'OPTIONS') {
context.done(null, {
body: '',
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.originalUrl || '/';
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?: FunctionResponse) => {
context.done(
error,
output && {
...output,
headers: {
...output.headers,
...corsHeaders,
},
},
);
};
graphqlAzureFunction(async () => {
await promiseWillStart;
return this.createGraphQLServerOptions(req, context);
})(context, req, callbackFilter);
};示例7: return
return (
event: APIGatewayProxyEvent,
context: LambdaContext,
callback: APIGatewayProxyCallback,
) => {
if (cors && cors.origin) {
if (typeof cors.origin === 'string') {
corsHeaders['Access-Control-Allow-Origin'] = cors.origin;
} else if (
typeof cors.origin === 'boolean' ||
(Array.isArray(cors.origin) &&
cors.origin.includes(
event.headers['Origin'] || event.headers['origin'],
))
) {
corsHeaders['Access-Control-Allow-Origin'] =
event.headers['Origin'] || event.headers['origin'];
}
if (!cors.allowedHeaders) {
corsHeaders['Access-Control-Allow-Headers'] =
event.headers['Access-Control-Request-Headers'];
}
}
if (event.httpMethod === 'OPTIONS') {
return callback(null, {
body: '',
statusCode: 204,
headers: corsHeaders,
});
}
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',
...corsHeaders,
},
});
}
}
const callbackFilter: APIGatewayProxyCallback = (error, result) => {
callback(
error,
result && {
...result,
headers: {
...result.headers,
...corsHeaders,
},
},
);
};
graphqlLambda(async () => {
// In a world where this `createHandler` was async, we might avoid this
// but since we don't want to introduce a breaking change to this API
// (by switching it to `async`), we'll leverage the
// `GraphQLServerOptions`, which are dynamically built on each request,
// to `await` the `promiseWillStart` which we kicked off at the top of
// this method to ensure that it runs to completion (which is part of
// its contract) prior to processing the request.
await promiseWillStart;
return this.createGraphQLServerOptions(event, context);
})(event, context, callbackFilter);
};示例8: return
return (req: Request, res: Response) => {
// Handle both the root of the GCF endpoint and /graphql
// With bare endpoints, GCF sets request params' path to null.
// The check for '' is included in case that behaviour changes
if (req.path && !['', '/', '/graphql'].includes(req.path)) {
res.status(404).end();
return;
}
if (cors) {
if (typeof cors.origin === 'string') {
res.set('Access-Control-Allow-Origin', cors.origin);
} else if (
typeof cors.origin === 'boolean' ||
(Array.isArray(cors.origin) &&
cors.origin.includes(req.get('origin') || ''))
) {
res.set('Access-Control-Allow-Origin', req.get('origin'));
}
if (!cors.allowedHeaders) {
res.set(
'Access-Control-Allow-Headers',
req.get('Access-Control-Request-Headers'),
);
}
}
if (req.method === 'OPTIONS') {
res.status(204).send('');
return;
}
if (this.playgroundOptions && req.method === 'GET') {
const acceptHeader = req.headers['accept'] as string;
if (acceptHeader && acceptHeader.includes('text/html')) {
const playgroundRenderPageOptions: PlaygroundRenderPageOptions = {
endpoint: req.get('referer'),
...this.playgroundOptions,
};
res
.status(200)
.send(renderPlaygroundPage(playgroundRenderPageOptions));
return;
}
}
res.set(corsHeaders);
graphqlCloudFunction(async () => {
// In a world where this `createHandler` was async, we might avoid this
// but since we don't want to introduce a breaking change to this API
// (by switching it to `async`), we'll leverage the
// `GraphQLServerOptions`, which are dynamically built on each request,
// to `await` the `promiseWillStart` which we kicked off at the top of
// this method to ensure that it runs to completion (which is part of
// its contract) prior to processing the request.
await promiseWillStart;
return this.createGraphQLServerOptions(req, res);
})(req, res);
};