# Fumadocs (Framework Mode, Waku): アクセス制御
URL: /ja/docs/waku/guides/access-control
Source: https://raw.githubusercontent.com/fuma-nama/fumadocs/refs/heads/main/apps/docs/content/docs/(framework)/[framework]/guides/access-control.ja.mdx

コンテンツへのアクセスを制限します。

## 概要 [#overview]

Fumadocs は柔軟に設計されているため、アクセス制御も簡単に実装できます。

## ローダー API [#loader-api]

[`loader()`](/docs/headless/source-api) API を使用している場合は、ローダーを必要に応じて作成し、コンテンツソースのファイルをフィルタリングすることで、アクセスできるコンテンツを制限できます。

たとえば、Fumadocs MDX を使った次の設定では、フロントマターに `permission: public` が指定された MDX ファイルのみを表示します。

```ts title="lib/source.ts"
import { docs } from 'collections/server';
import { loader, update } from 'fumadocs-core/source';

const filteredSource = update(docs.toFumadocsSource())
  .files((files) =>
    files.filter((file) => {
      // meta ファイル（例: `meta.json`）は残す
      if (file.type === 'meta') return true;

      // ファイルデータにアクセス（型安全）
      return file.data.permission === 'public';
    }),
  )
  .build();

export const source = loader(filteredSource, {
  baseUrl: '/docs',
});
```

より複雑な構成の場合は、`source` をファクトリー関数にすることもできます。

```ts title="lib/source.ts"
import { docs } from 'collections/server';
import { loader, update } from 'fumadocs-core/source';

// キャッシュなし。実際のユースケースではインメモリでキャッシュすることをおすすめします。
export function createSource(permission: 'public' | 'admin') {
  const filteredSource = update(docs.toFumadocsSource())
    .files((files) =>
      files.filter((file) => {
        if (file.type === 'meta') return true;

        return file.data.permission === permission;
      }),
    )
    .build();

  return loader(filteredSource, {
    baseUrl: '/docs',
  });
}
```

次に、ユーザーごとにソースを作成します。

```ts
// [!code --]
import { source } from '@/lib/source';
// [!code ++:4]
import { createSource } from '@/lib/source';

const user = await getUser();
const source = createSource(user.permission);

const page = source.getPage(params.slugs);
```

### 利点 [#advantages]

このアプローチの特長は、レンダリング段階やビルド時ではなく、**入力の段階でアクセスを制限する**点です。

これにより、柔軟性を損なうことなく、保護されたコンテンツを完全に除外できます。

## カスタム実装 [#custom-implementation]

ローダー API を使わない場合は、ルートやミドルウェアなど、Waku 側でアクセス制御を実装します。

たとえば、特定のページへのアクセスを制限するには次のようにします。

```tsx title="src/pages/docs/[...slugs].tsx"
import type { PageProps } from 'waku/router';
import { unstable_notFound } from 'waku/router/server';
import { source } from '@/lib/source';

export default async function Page({ slugs }: PageProps<'/docs/[...slugs]'>) {
  const user = await getUser();
  const page = source.getPage(slugs);

  if (!page) unstable_notFound();
  if (page.data.permission !== user.permission) unstable_notFound();

  // ページをレンダリング...
}

// リクエストごとにレンダリング（静的ページはユーザー情報なしでビルドされるため）
export const getConfig = async () => ({ render: 'dynamic' }) as const;
```

なお、ページツリー (サイドバーの項目) 、検索、Markdown ルートなどの細かな部分は、ご自身で管理する必要があります。

この方法は最も柔軟性が高い反面、Fumadocs はアクセス制御に関与しません。セットアップにも手間がかかるため、実装する際は Waku のドキュメントを参照してください。