はらへり日記

腹に弾丸

LaravelのAjax通信でCSRFトークンを扱う

LaravelにおけるCSRFトークン

Laravel5.1(おそらく以前のバージョンも)ではデフォルトでCSRFトークンによる認証ミドルウェアが有効になっています。

なのでフォームを書くときは以下のようなBladeファイルを書く必要がある。

<form method="POST">
  <input type="text">
  <input type="submit">
  {{ csrf_token() }}
</form>

こうするとtype="hidden"CSRFトークンを生成し埋め込んでくれる。

しかしAjax通信をしようと思うとちとめんどくさい。ぱっと思いつくのは以下の2つの方法。

  • Ajax用のCSRFトークンをどこかに記載し、それを_tokenパラメーターとして送る方法
  • アプリケーション側でAjaxリクエストの場合はミドルウェアを無効にする方法

前者は規模が大きくなればなるほど管理がめんどくさいし、後者は場合によっちゃありだがセキュリティ的によろしくない。

じゃどうすればいいのよ!

結論

いつだって答えはドキュメントにあります。

HTTPルーティング 5.1 Laravel

jQueryAjaxを行う場合に限る解決策ですが、ライブラリが変わっても本質は同じかと。

要するに全ページの<meta>タグでcsrf_token()を埋め込み、ajax通信のデフォルトヘッダにそこを読みこませるように設定しなよ!ってこと。

こうすることで一度設定してあげればトークンを意識することなくセキュアなAjax通信ができる。

(以下、ドキュメントより丸々抜粋)

<meta name="csrf-token" content="{{ csrf_token() }}">
$.ajaxSetup({
        headers: {
            'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
        }
});

僕の場合はAjax通信を1クラスに集約しているのでそこで4行書くだけで後は何もせずともオッケーな感じになっている。

まとめ

ドキュメント読もうぜ!!!