createAsyncAPI()
AsyncAPI のサーバーインスタンスです。
AsyncAPI Server
Fumadocs AsyncAPI のメイン設定です。
ブラウザ環境では参照しないでください。
input
読み込む AsyncAPI スキーマです。
- ファイルパス
- 外部 URL
- 関数(後述)
読み込めるのはここに列挙したスキーマのみです。それ以外の ID を getSchema() に渡したり、ページでプリロードしたりするとエラーがスローされます。
信頼できないスキーマを input に渡さないでください。スキーマ内の $ref によって、ローカルファイルの読み取りや、プライベートホストを含む任意の URL へのフェッチが行われる可能性があります。
import { createAsyncAPI } from '@fumadocs/asyncapi/server';
export const asyncapi = createAsyncAPI({
input: ['./streetlights.yaml'],
});disableCache
読み込んだスキーマのキャッシュを無効にします。スキーマを頻繁に変更する開発時に便利です。
import { createAsyncAPI } from '@fumadocs/asyncapi/server';
export const asyncapi = createAsyncAPI({
input: ['./asyncapi.yaml'],
disableCache: true,
});ドキュメントを一度だけ読み込む
ページは props としてドキュメント全体を受け取るため、ページの読み込み、ナビゲーション、プリフェッチのたびにドキュメントが毎回送信されます。大きなドキュメントの場合は、props に含めないようにしてください。
import { createAsyncAPI } from '@fumadocs/asyncapi/server';
export const asyncapi = createAsyncAPI({
// ID は URL に含まれるため、URL セーフにしてください
input: { streetlights: './streetlights.yaml' },
includeDocument: false,
});loadDocument を渡すと、各ドキュメントの読み込みがブラウザセッションごとに1回だけになります。この関数はサーバーレンダリング時にも実行されます。
'use client';
import { preload } from 'react-dom';
import { createAsyncAPIPage } from '@fumadocs/asyncapi/ui';
export const AsyncAPIPage = createAsyncAPIPage({
async loadDocument(id) {
if (import.meta.env.SSR) {
// ブラウザがページと同時にダウンロードを開始する
preload(`/api/asyncapi/${id}`, { as: 'fetch', crossOrigin: 'anonymous' });
const { asyncapi } = await import('@/lib/asyncapi');
return (await asyncapi.getSchema(id)).bundled;
}
return (await fetch(`/api/asyncapi/${id}`)).json();
},
});ルートを用意して、ブラウザにドキュメントを配信します。
import type { APIRoute, GetStaticPaths } from 'astro';
import { asyncapi } from '@/lib/asyncapi';
export const prerender = true;
export const getStaticPaths = (async () => {
return Object.keys(await asyncapi.getSchemas()).map((id) => ({ params: { id } }));
}) satisfies GetStaticPaths;
export const GET: APIRoute = async ({ params }) => {
return Response.json((await asyncapi.getSchema(params.id!)).bundled);
};loadDocumentは生成された MDX ファイルでも使用できます。- Fumadocs CLI でインストールした UI の場合は、
loadDocumentをcreateAsyncAPIRenderer()に渡してください。 - ブラウザは各ドキュメントをリロードまで保持します。
disableCacheを使用する場合は、includeDocumentを有効にしたままにしてください。
How is this guide?
最終更新日
General Translation
Ferry Health
assistant-ui
Inkeep