起きていたこと
Laravelを使っていてVueのメソッド中からPOSTしようとすると419エラー(TokenMismatchException)が発生し、コントローラ中の処理を動かせませんでした。
↓のサイトなどを見つつ、
https://labor.ewigleere.net/2019/01/31/axios-session-cors/
hoge.blade.php
・・・ 略 ・・・
var axiosPost = axios.create({
xsrfHeaderName: 'X-CSRF-Token',
withCredentials: true
})
axiosPost.post([URL], [送信データ])
・・・ 略 ・・・
とかやってみたりしたのですがうまくいかず・・・。
対処
結局、xsrfHeaderNameには、X-CSRF-TOKENではなく、X-XSRF-TOKENを、または、xsrfCookieNameにXSRF-TOKENをセットします。
withCredentialsはどちらもtrueです。
hoge.blade.php
・・・ 略 ・・・
var axiosPost = axios.create({
xsrfHeaderName: "X-XSRF-TOKEN",
withCredentials: true
})
axiosPost.post([URL], [送信データ])
・・・ 略 ・・・
または、
hoge.blade.php
・・・ 略 ・・・
var axiosPost = axios.create({
xsrfCookieName: "XSRF-TOKEN",
withCredentials: true
})
axiosPost.post([URL], [送信データ])
・・・ 略 ・・・
LaravelのヘルプにはX-XSRF-TOKENは勝手にセットされるみたいな書き方に見えるのですが、自分の環境では上のように明示的に指定してあげないとセットされないようでした。まあ動くようになったので良いのですが、いまいちよくわかりません・・・。