BETA

LaravelでVue.jsを使ってAjaxでPOSTする時のCSRFの設定

投稿日:2020-02-11
最終更新:2020-02-11

LaravelでVue.jsを使ってAjaxでPOSTする時のCSRFの設定で苦戦したので書きます。
マニュアルにはajaxでcsrfを使うときは下記の通り設定してください、とあります。
(1)

<meta name="csrf-token" content="{{ csrf_token() }}">  

(2)

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

(1)は良いんだけど、(2)はVue.jsだと効かないです。attrがjQuery用のfunctionだからだと思います。tokenの取得に失敗し、419のエラーになります。

解決策

headers: {  
    'X-CSRF-TOKEN': document.getElementsByName('csrf-token')[0].content  
},  

これでcsrfのtokenが取得できるようになり、419エラーが出なくなります。

技術ブログをはじめよう Qrunch(クランチ)は、プログラマの技術アプトプットに特化したブログサービスです
駆け出しエンジニアからエキスパートまで全ての方々のアウトプットを歓迎しております!
or 外部アカウントで 登録 / ログイン する
クランチについてもっと詳しく

この記事が掲載されているブログ

あろはの技術ブログ

よく一緒に読まれる記事

0件のコメント

ブログ開設 or ログイン してコメントを送ってみよう