Larave + Vue で普通にFormを使う際のCSRF Token処理

Laravel 5.8
Vue 2.5.17

VueはSPAでやることが多いみたいですが、Ajaxではなく、単純にLaravelのControllerにPostをする場合の話

LaravelのBladeを利用する場合は以下をFormに埋め込めばいいですが、もちろんvueのコンポーネントで利用できないので手動で埋め込んでやる必要がある。

<form>
    @csrf
</form>

やり方はシンプル、blade上でcsrf tokenを取得して、コンポーネントに連携するだけ

//blade.php
<component :csrf="{{json_encode(csrf_token())}}"></component>

//Vue component

<template>
  <form>
    <input type="hidden" name="_token" v-bind:value="csrf">
  </form>
</template>

<script>
  export default {
    props:  {
      csrf: {
        type: String,
        required: true,
      }
    }
  }
</script>