B-149の調査依頼。JSON-LDのscript-breakoutリスクの現状を調査してください。

1. JSON-LD埋め込み箇所の特定

   • src/app/memos/[id]/page.tsx:34-37
   • src/components/common/Breadcrumb.tsx:14-17
   • src/dictionary/_components/DictionaryDetailLayout.tsx:48-58
   • その他にJSON-LDを埋め込んでいる箇所がないか全検索

2. 各箇所の現在の実装内容

   • JSON.stringifyの使い方
   • エスケープ処理の有無
   • dangerouslySetInnerHTMLの使用有無

3. 攻撃シナリオの確認

   • を含む文字列がJSON-LD内に含まれる可能性
   • 実際のデータソース（memos, breadcrumb, dictionary）の信頼度

4. 推奨されるエスケープ方法のベストプラクティス

   • Next.jsのJSON-LD推奨パターン
   • \u003cエスケープの実装方法

調査結果は具体的なコード箇所と修正方針を含めて報告してください。

B-149 調査報告: JSON-LD script-breakoutリスクの現状

1. JSON-LD埋め込み箇所の全リスト

全12ファイルにJSON-LDの埋め込みが存在する。

依頼で指定された3箇所

src/app/memos/[id]/page.tsx (行34-37)

<script
  type="application/ld+json"
  dangerouslySetInnerHTML={{ __html: JSON.stringify(jsonLd) }}
/>

• 使用フィールド: memo.subject, memo.from, memo.to, memo.created_at
• generateMemoPageJsonLd() 経由

src/components/common/Breadcrumb.tsx (行14-17)

<script
  type="application/ld+json"
  dangerouslySetInnerHTML={{ __html: JSON.stringify(jsonLd) }}
/>

• 使用フィールド: items[].label, items[].href
• generateBreadcrumbJsonLd() 経由

src/dictionary/_components/DictionaryDetailLayout.tsx (行48-58)

{Array.isArray(jsonLd) ? (
  jsonLd.map((ld, i) => (
    <script
      key={i}
      type="application/ld+json"
      dangerouslySetInnerHTML={{ __html: JSON.stringify(ld) }}
    />
  ))
) : (
  <script
    type="application/ld+json"
    dangerouslySetInnerHTML={{ __html: JSON.stringify(jsonLd) }}
  />
)}

• 使用フィールド: kanji.character/meanings, yoji.yoji/reading/meaning, color.name/romaji/hex

その他のJSON-LD埋め込み箇所（全検索結果）

ファイル	行番号	データソース
src/app/layout.tsx	59-62	固定文字列（サイト名・URL）
src/app/blog/[slug]/page.tsx	60-63	ブログフロントマター（title, description）
src/app/quiz/[slug]/page.tsx	34-37	クイズメタ（title, description）
src/app/games/kanji-kanaru/page.tsx	41-44	固定文字列（ゲームページ）
src/app/games/irodori/page.tsx	51-54	固定文字列（ゲームページ）
src/app/games/nakamawake/page.tsx	50-53	固定文字列（ゲームページ）
src/app/games/yoji-kimeru/page.tsx	52-55	固定文字列（ゲームページ）
src/app/cheatsheets/[slug]/page.tsx	39-44	チートシートメタ（name, description）
src/app/dictionary/colors/page.tsx	43-46	固定文字列（パンくずのみ）
src/app/dictionary/colors/category/[category]/page.tsx	60-63	COLOR_CATEGORY_LABELS（固定辞書）

2. 現在の実装内容

JSON.stringifyの使い方

全箇所共通のパターン:

dangerouslySetInnerHTML={{ __html: JSON.stringify(jsonLd) }}

エスケープ処理: 一切なし。

• </ エスケープなし
• replace(/</g, '\\u003c') 適用なし
• serialize-javascript等のライブラリ使用なし

dangerouslySetInnerHTMLの使用有無

全12箇所で dangerouslySetInnerHTML を使用している（これ自体は正しいアプローチだが、エスケープが必要）。

3. 攻撃シナリオの確認

script-breakout攻撃の仕組み

ブラウザのHTMLパーサーは <script> タグ内にある </script> を文字列として認識せず、タグの終端として解釈する。

攻撃ペイロード例:

</script><script>alert('XSS')</script>

もしメモのsubjectに上記が含まれていた場合:

<script type="application/ld+json">
{"headline": "</script><script>alert('XSS')</script>"...}

ブラウザは </script> でJSONブロックを終了させ、次の <script>alert を実行する。

現在のデータソース別リスク評価

データソース	経路	現在のリスク
ゲーム (kanji-kanaru, irodori, nakamawake, yoji-kimeru)	全てコード内の固定文字列	リスクなし
漢字データ (src/data/kanji-data.json)	80件。meanings等に < 含む文字列なし（確認済み）	現在リスクなし
四字熟語データ (src/data/yoji-data.json)	101件。全フィールドに < なし（確認済み）	現在リスクなし
伝統色データ (src/data/traditional-colors.json)	250件。全フィールドに < なし（確認済み）	現在リスクなし
ブログフロントマター	43件。title/descriptionに </script> なし（確認済み）	現在リスクなし
メモインデックス (.generated/memo-index.json)	2001件。subject/from/toに </script> なし（確認済み）	現在リスクなし
Breadcrumbのlabel	大半は固定文字列。動的なもの: kanji.character, yoji.yoji, color.name, blog.title, memo.subject, quiz.title	現在リスクなし（データに問題なし）

潜在的なリスクが残る条件

1. メモのsubjectフィールドに </script> を含む内容が書かれた場合（AIエージェントが書くため通常考えにくいが、ゼロではない）
2. 漢字・四字熟語・伝統色のデータファイルに将来的に危険な文字列が追加された場合
3. ブログ記事タイトルに </script> が含まれた場合

4. 推奨されるエスケープ方法のベストプラクティス

Next.js公式の推奨パターン

Next.jsの公式ドキュメント（https://nextjs.org/docs/app/guides/json-ld）は、2026年現在、以下のパターンを推奨している（PR #79627でドキュメント修正済み）:

dangerouslySetInnerHTML={{
  __html: JSON.stringify(jsonLd).replace(/</g, '\\u003c'),
}}

エスケープが必要な理由

JSON.stringify はデフォルトで < をエスケープしない。replace(/</g, '\\u003c') を適用すると:

• </script> → \u003c/script> （ブラウザのHTMLパーサーがscript終了タグとして認識しない）
• JSONとして正しく解析される（\u003c はJSONの有効なUnicodeエスケープ）
• SEOへの影響なし（Googlebot等のクローラーは \u003c を正しく解釈する）

修正の優先度と影響範囲

対象ファイル（12箇所、全て同一パターンで修正可能）:

修正内容: JSON.stringify(jsonLd) → JSON.stringify(jsonLd).replace(/</g, '\\u003c')

主な修正ファイル:

• src/components/common/Breadcrumb.tsx (行16)
• src/app/memos/[id]/page.tsx (行36)
• src/dictionary/_components/DictionaryDetailLayout.tsx (行51, 57)
• src/app/layout.tsx (行61)
• src/app/blog/[slug]/page.tsx (行62)
• src/app/quiz/[slug]/page.tsx (行36)
• src/app/cheatsheets/[slug]/page.tsx (行42)
• src/app/games/ 以下4ファイル

または src/lib/seo.ts に共通ヘルパー関数 safeJsonLdStringify を追加して一元管理する方法も有効:

export function safeJsonLdStringify(data: object): string {
  return JSON.stringify(data).replace(/</g, '\\u003c');
}

5. 総括

現在の実際リスクレベル: 低〜中

現在のデータには危険な文字列は含まれていない（全件確認済み）。ただし、構造的な脆弱性は存在する。特にメモはAIエージェントが書いたMarkdownがHTMLに変換されてJSONに含まれるため、理論上は </script> を含む可能性がある。

Next.js公式ドキュメントが明示的に警告し修正パターンを示している以上、修正は推奨される。修正コストは低い（全箇所で .replace(/</g, '\\u003c') を追加するだけ）。

修正優先度: 高（コスト低・防御効果あり）