# 画面設計書 9-ルーティングエラー画面

## 概要

本ドキュメントは、Ruby on Rails フレームワークにおけるルーティングエラー画面の画面設計を定義するものである。

### 本画面の処理概要

本画面は、リクエストされたURLに対応するルートが定義されていない場合（404 Not Found）に表示されるエラー画面である。エラーメッセージ、マッチング失敗の理由、定義済みルート一覧を表示し、開発者がルーティング問題を診断できるようにする。

**業務上の目的・背景**：URLの入力ミス、ルーティング定義の漏れ、HTTPメソッドの不一致などによるルーティングエラーを診断するために使用される。単なるエラーメッセージだけでなく、具体的な失敗理由（制約条件の不一致等）と、定義済みの全ルート一覧を表示することで、開発者が問題を特定しやすくする。

**画面へのアクセス方法**：開発環境において、存在しないURLにアクセスした場合、または定義されたルートの制約条件に一致しないリクエストを行った場合に自動的に表示される。

**主要な操作・処理内容**：
1. ActionController::RoutingError例外をキャッチ
2. ExceptionWrapperでrescue_template = "routing_error"を選択
3. 失敗理由（failures）を収集
4. RoutesInspectorで定義済みルート一覧を生成
5. routing_error.html.erbテンプレートで描画

**画面遷移**：
- 遷移元：ルートが見つからないURL/HTTPメソッドの組み合わせでアクセス
- 遷移先：特になし（エラー画面）

**権限による表示制御**：`action_dispatch.show_detailed_exceptions` 設定に依存。開発環境でのみ詳細表示。

## 関連機能

| 機能No | 機能名 | 関連種別 | 関連する操作・処理 |
|--------|--------|----------|------------------|
| 15 | Journey | 主機能 | ルーティングマッチング失敗時の診断情報生成 |
| 26 | Debug Exceptions | 主機能 | RoutingError例外の捕捉・表示処理 |
| 8 | Action Dispatch | 補助機能 | 定義済みルート一覧の表示処理 |

## 画面種別

エラー画面（ルーティングエラー）

## URL/ルーティング

本画面は特定のURLに紐づかない。ルーティングエラー発生時に自動的に表示される。

| HTTP メソッド | URL パターン | コントローラー#アクション | 備考 |
|--------------|--------------|--------------------------|------|
| * | * | - | ルーティングエラー発生時に自動表示 |

## 入出力項目

本画面は表示専用であり、ユーザーからの入力項目は存在しない。

### 出力項目

| 項目名 | 表示形式 | 説明 |
|--------|----------|------|
| タイトル | h1要素 | "Routing Error" |
| エラーメッセージ | h2要素 | 具体的なエラーメッセージ |
| 失敗理由一覧 | ol要素 | マッチング失敗の具体的な理由 |
| スタックトレース | div要素 | Application/Framework/Full Trace |
| 定義済みルート | table要素 | HtmlTableFormatterによるルート一覧 |
| リクエスト/レスポンス | div要素 | リクエストパラメータ、ヘッダー等 |

## 表示項目

| No | 項目ID | 項目名 | データ型 | 取得元 | 備考 |
|----|--------|--------|----------|--------|------|
| 1 | title | タイトル | String | 固定値 | "Routing Error" |
| 2 | message | エラーメッセージ | String | @exception_wrapper.message | 例外のメッセージ |
| 3 | failures | 失敗理由 | Array | @exception_wrapper.failures | ルートと失敗理由のペア |
| 4 | traces | スタックトレース | Hash | @traces | Application/Framework/Full Trace |
| 5 | routes | 定義済みルート | RoutesInspector | @routes_inspector | 全ルート一覧 |

## イベント仕様

### 1-トレース切り替え

**トリガー**: Application Trace/Framework Trace/Full Trace のリンクをクリック

**処理内容**:
1. JavaScript toggle関数を実行
2. 選択されたトレースタイプを表示、他を非表示

**遷移先**: 同一画面（表示切り替え）

## データベース更新仕様

### 操作別データベース影響一覧

本画面はデータベースアクセスを行わない。

| 操作（イベント） | 対象テーブル | 操作種別 | 概要 |
|----------------|-------------|---------|------|
| - | - | - | データベースアクセスなし |

## メッセージ仕様

| メッセージID | メッセージ種別 | 表示条件 | メッセージ内容 |
|-------------|---------------|---------|--------------|
| MSG-001 | エラー | 常時 | "No route matches [METHOD] /path" |
| MSG-002 | 情報 | failures存在時 | "failed because {reason}" |

## 例外処理

本画面はルーティングエラー発生時に表示される画面である。

| 例外条件 | 動作 |
|---------|------|
| ActionController::RoutingError | 本画面を表示 |

## 備考

- 本画面は開発環境でのみ詳細表示される
- 本番環境では `public/404.html` 等の静的ファイルに表示される
- HTTPステータスコードは404 (Not Found)
- failures配列には、マッチング候補となったルートとその失敗理由が含まれる
- 失敗理由の例：制約条件の不一致、フォーマットの不一致等
- ルート一覧はRoutesInspector + HtmlTableFormatterで生成

---

## コードリーディングガイド

本画面を理解するために参照すべきファイルと、推奨する読み解き順序を以下に示す。

### 推奨読解順序

#### Step 1: データ構造を理解する

ルーティングエラーの構造を理解する。

| 順序 | ファイル | パス | 読解ポイント |
|-----|---------|------|-------------|
| 1-1 | exception_wrapper.rb | `actionpack/lib/action_dispatch/middleware/exception_wrapper.rb` | rescue_templatesでのrouting_errorマッピングを理解する |

**読解のコツ**:
- `rescue_templates["ActionController::RoutingError"] = "routing_error"` (行33)
- `routing_error?` メソッド (行62-64): RoutingError判定
- `failures` メソッド (行78-80): 失敗理由取得

#### Step 2: エラー発生箇所を理解する

ルーティングエラーの発生タイミングを理解する。

| 順序 | ファイル | パス | 読解ポイント |
|-----|---------|------|-------------|
| 2-1 | debug_exceptions.rb | `actionpack/lib/action_dispatch/middleware/debug_exceptions.rb` | X_CASCADEヘッダーとRoutingError発生を理解する |

**主要処理フロー**:
1. **32-36行目**: X_CASCADE="pass"の場合にRoutingErrorを発生
2. **203-207行目**: `routes_inspector` - ルーティングエラー時にRoutesInspectorを生成

#### Step 3: ビューテンプレートを理解する

HTML描画の仕組みを理解する。

| 順序 | ファイル | パス | 読解ポイント |
|-----|---------|------|-------------|
| 3-1 | routing_error.html.erb | `actionpack/lib/action_dispatch/middleware/templates/rescues/routing_error.html.erb` | テンプレートの構造を理解する |

**主要処理フロー**:
- **1-4行目**: ヘッダー部（コピーボタン、タイトル）
- **6行目**: エラーメッセージ表示
- **7-16行目**: 失敗理由一覧（failuresが空でない場合）
- **18行目**: スタックトレース表示
- **20-30行目**: 定義済みルート一覧（@routes_inspectorが存在する場合）
- **32行目**: リクエスト/レスポンス情報

### プログラム呼び出し階層図

```
リクエスト処理
    │
    ├─ ルーティングマッチング (Journey)
    │      │
    │      └─ マッチするルートなし → X_CASCADE="pass"
    │
    └─ DebugExceptions#call
           │
           ├─ X_CASCADE="pass" 検出
           │      │
           │      └─ raise ActionController::RoutingError
           │
           ├─ rescue Exception => exception
           │      │
           │      └─ ExceptionWrapper.new(backtrace_cleaner, exception)
           │             │
           │             ├─ rescue_template = "routing_error"
           │             └─ failures 収集
           │
           └─ render_exception
                  │
                  ├─ routes_inspector(exception) - RoutesInspector生成
                  │
                  └─ template.render(template: "rescues/routing_error")
                         │
                         ├─ _copy_button.html.erb
                         ├─ エラーメッセージ
                         ├─ 失敗理由一覧
                         ├─ _trace.html.erb
                         ├─ HtmlTableFormatter（ルート一覧）
                         └─ _request_and_response.html.erb
```

### データフロー図

```
[入力]                        [処理]                           [出力]

存在しないURLへのリクエスト
        │
        └──▶ Journey ルーティングエンジン
                    │
                    └─ マッチング失敗
                           │
                           ├─ X_CASCADE="pass" 設定
                           │
                           └─ failures 収集
                                  │
                                  ├─ マッチ候補ルート
                                  └─ 失敗理由
                                                              ↓
                                            DebugExceptions ミドルウェア
                                                    │
                                                    ├─ RoutingError 発生
                                                    │
                                                    └─ RoutesInspector 生成
                                                              ↓
                                                    HTML エラーページ
                                                    (routing_error.html.erb)
```

### 関連ファイル一覧

| ファイル | パス | 種別 | 役割 |
|---------|------|------|------|
| debug_exceptions.rb | `actionpack/lib/action_dispatch/middleware/debug_exceptions.rb` | ミドルウェア | 例外キャッチとRoutingError発生 |
| exception_wrapper.rb | `actionpack/lib/action_dispatch/middleware/exception_wrapper.rb` | ソース | 例外情報のラッピング、failures取得 |
| routing_error.html.erb | `actionpack/lib/action_dispatch/middleware/templates/rescues/routing_error.html.erb` | テンプレート | ルーティングエラー画面 |
| _trace.html.erb | `actionpack/lib/action_dispatch/middleware/templates/rescues/_trace.html.erb` | パーシャル | スタックトレース表示 |
| _request_and_response.html.erb | `actionpack/lib/action_dispatch/middleware/templates/rescues/_request_and_response.html.erb` | パーシャル | リクエスト/レスポンス情報 |
| _copy_button.html.erb | `actionpack/lib/action_dispatch/middleware/templates/rescues/_copy_button.html.erb` | パーシャル | クリップボードコピーボタン |
| inspector.rb | `actionpack/lib/action_dispatch/routing/inspector.rb` | ソース | RoutesInspector、HtmlTableFormatter |
