Lesson 12

異常系の対応

Lesson 12 Chapter 1
共通エラーページを作る（500エラー）

Lesson12ではエラーページの作成を行なっていきましょう。エラーページを準備しておくことで利用するユーザーにとっても不信感なくサービスを利用することが可能となります。またオリジナルなエラーページを作成することでサービスとのデザイン面で統一感も出すことが可能ですので、エラーページについても認識しておきましょう。

500エラーとは

500エラーとは何かしらの原因によりサーバーが処理を実行できない時に発生するエラーです。利用するユーザーによって操作の仕方は様々な為、このような予期しないエラーが発生した際に備えてLaravelではデフォルトで500エラーの画面が用意されています。

500エラー画面

500エラー画面の作成

デフォルトの500エラー画面でも十分と言えますが、サービスに合わせたエラーページや「トップへ戻る」ボタンなどがあるとユーザーに対しても丁寧です。ここでは500エラーページを作成し、表示させるまでをゴールとして進めていきましょう。

1. エラー用のblade.phpを作成する。

それでは早速、500エラーが発生した際に表示するエラーページを作成していきます。以下ディレクトリに作成してください。

resources > views > errors > 500.blade.php

500.blade.php
<!doctype html>
<html lang="ja">

<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1">

  <title>500エラー</title>

  <link rel="dns-prefetch" href="//fonts.gstatic.com">
  <link href="https://fonts.bunny.net/css?family=Nunito" rel="stylesheet">
  <link href="{{ asset('/css/style.css') }}" rel="stylesheet">

</head>

<body>
  <div id="app">
    <div class="w-75 m-auto">
      <div class="error_container m-5 p-3">
        <div class="error_grid">
          <p>エラー(500)</p>
          <p>予期せぬエラーが発生しました</p>
          <a class="btn" href={{ route("todo.lists") }}>トップへ戻る</a>
        </div>
      </div>
    </div>
  </div>
</body>

</html>

errorsディレクトリ内に「エラーステータス.blade.php」と作成しておくことで、エラーが発生した際にはLaravel側で自動的にページの遷移を行ってくれるよう設定がされています。その為、ルーティングやControllerへの設定は不要でblade.phpの作成のみで実装できます。

2. 500.blade.phpへ遷移させる処理

上記でもお伝えしたとおり、エラー画面に関してはblade.phpを作成するだけでエラーページの表示を行なってくれる為、遷移させる処理等は不要になります。しかし今回は学習も兼ねて、任意の処理に500エラーページを組み込んでいきます。TodosControllerを開きましょう。

app > Http > Controllers > TodosController.php

TodosController.php
public function TodoUpdate(TodoUpdateRequest $request)
{
    $todo = Todo::find($request->id);

    $todo->todo_priority = $request->todo_priority;
    $todo->todo_time = $request->todo_time;
    $todo->todo = $request->todo;

    $todo->save();

    return redirect()->route("todo.lists");
  }

public function TodoCompleted($id)
{
    $todo = Todo::find($id);
    $todo->completed_flag = true;
    $todo->save();

    return back();
}


public function TodoDelete($id)
{
    $todo = Todo::find($id);
    $todo->delete();

    return back();
}

更新、完了、削除、3つの処理を用意しました。それぞれの処理に500エラーを発生させる条件を加えていきます。追加する条件は「TODOを追加したユーザーかどうか」を判定していきます。当然のことながら追加したユーザーでなければデータの操作は行えないように制御していきます。3つのメソッドにある全ての$todoの下に記述を追加してください。

（修正後）
TodosController.php
$todo = Todo::find...

if(!$todo->user_id == Auth::id()){
  abort(500);
}

$todo->user_idとは取得してきたデータ($todo)が持つユーザーIDを取得しています。$todo->user_idとログインユーザーのID（Auth::id()）を比較し、一致していない場合、abort(500)を実行する流れになります。

abort

Laravelではabortヘルパ関数が用意されている為、定義せずに使用することが可能です。abortヘルパが実行された際にはその後の処理は行わず、エラーページへと遷移してくれる役割を持っています。

3. 500エラーの動作確認

別のユーザーが追加したタスクを削除、更新、完了のいずれかを実行すると500エラーページへと遷移されます。

500エラー画面

Lesson 12 Chapter 2
ルーティングエラーページを作る

chapter2ではルーティングエラーページの作成を行なっていきましょう。

ルーティングエラーとは

ルーティングエラーは恐らく最も多く直面しているエラーかと思われます。普段ネットを利用していて「指定されたページが見つかりません」と目にした事があるのではないでしょうか。このように存在しないページへアクセスされた場合に表示させる404のエラーページを作成していきます。

404エラー画面の作成

1. エラー用のblade.phpを作成する。

先ほどの500エラーと同じように404.blade.phpの作成を行なっていきましょう。

resources > views > errors > 404.blade.php

404.blade.php
<!doctype html>
<html lang="ja">

<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1">

  <title>404エラー</title>

  <link rel="dns-prefetch" href="//fonts.gstatic.com">
  <link href="https://fonts.bunny.net/css?family=Nunito" rel="stylesheet">
  <link href="{{ asset('/css/style.css') }}" rel="stylesheet">

</head>

<body>
  <div id="app">
    <div class="w-75 m-auto">
      <div class="error_container m-5 p-3">
        <div class="error_grid">
          <p>エラー(404)</p>
          <p>指定されたページは存在しません。</p>
          <a class="btn" href={{ route("todo.lists") }}>トップへ戻る</a>
        </div>
      </div>
    </div>
  </div>
</body>

</html>

2. 動作確認

500エラーと違い、存在しないURLへのアクセス全てに対して404エラーを表示させるため、Controllerの設定は不要になります。動作確認していきましょう。存在しないURL（http://127.0.0.1:8000/top/top）へアクセスしてみてください。

404エラー画面

このように404エラー画面が表示されていれば成功です。

Lesson 12 Chapter 3
認証エラーページを作る

chapter3では認証用のエラーページを作成していきましょう。

認証用エラーとは

認証用エラーとはその名の通り、認証されていない場合に表示させるエラーページになります。例えば普段サービスを利用していて、ログイン情報のセッションが切れた際にログイン画面へリダイレクトされる処理もその一つです。Laravelでは一定の時間が過ぎるとログインのセッションが切れるようになっており、その際は自動的にログイン画面（デフォルトでは/home）へリダイレクトされるようになっていますが、こちらも万が一を想定して準備しておくとより確実なサービスとなります。

401エラー画面の作成

1. エラー用のblade.phpを作成する。

実装までの流れはこれまでと同様になります。認証エラーの場合は401エラーになるので401.blade.phpを作成します。

resources > views > errors > 401.blade.php

401.blade.php
<!doctype html>
<html lang="ja">

<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1">

  <title>401エラー</title>

  <link rel="dns-prefetch" href="//fonts.gstatic.com">
  <link href="https://fonts.bunny.net/css?family=Nunito" rel="stylesheet">
  <link href="{{ asset('/css/style.css') }}" rel="stylesheet">

</head>

<body>
  <div id="app">
    <div class="w-75 m-auto">
      <div class="error_container m-5 p-3">
        <div class="error_grid">
          <p>エラー(401)</p>
          <p>アクセス権限がありません。</p>
          <a class="btn" href={{ route("login") }}>ログイン画面へ戻る</a>
        </div>
      </div>
    </div>
  </div>
</body>

</html>

2. 動作確認

401エラーが発生した際には以下の画面が表示されるようになっています。

401エラー画面

このようにLaravelでエラー画面を作成する際は「エラーステータス.blade.php」と作成しておくだけで、該当のエラーが発生した場合に自動でリダイレクトしてくれます。エラーページ作成はこれで以上になります。