vuejs2.0 httpでLaravelのTokenMismatchExceptionになってしまうとき
vuejs
のhttp
を使ったajax
のアクセス時にサーバ側でlaravel
のTokenMismatchException
になってしまう場合があります。
原因はリクエスト情報にcsrf_token
がないのが原因です。
Laravel5.3
ではインストール時にvuejs
のサンプルが初期設定されています。
そのソースのbootstrap.js
で以下のようにhttp
のヘッダにcsrf_token
をセットしています。
Vue.http.interceptors.push((request, next) => {
request.headers['X-CSRF-TOKEN'] = Laravel.csrfToken; //ここでリクエストのヘッダにセット
next();
});
しかしリクエスト情報を確認してみるとX-CSRF-TOKEN
がセットされていませんでした。
Laravel5.3に組み込まれているvuejs
はバージョンが1なので、2.0だと少しセットの仕方を変える必要があるようです。
Vue.http.interceptors.push((request, next) => {
//request.headers['X-CSRF-TOKEN'] = Laravel.csrfToken;
request.headers.set('X-CSRF-TOKEN', Laravel.csrfToken); //変更
next();
});
これでリクエスト情報にセットされると思います。