Laravel + Vue + Axiosでmultipart/form-dataをPUTする

タイトル通りの記事ですが、若干つまづいたことがあったためメモを残します。

クライアント側

ポイントは_methodパラメータをつけてあげることと、postで送信することです。

export default {
   data() {
       return {
           userId: '',
           userName: '',
           avatarImageData: '', // Blobデータが入る
       };
   },
   methods: {
       updateProfile() {
           let formData = new FormData();
           formData.append('_method', 'PUT'): // こいつで擬似PUTメソッド化する
           formData.append('userId', this.userId);
           formData.append('userName', this.userName);
           formData.append('avatarImage', this.avatarImageData);

           axios.post(
               '/api/path?api_token=' + Laravel.apiToken,
               formData,
               {
                   headers: {
                       'Content-Type': 'multipart/form-data'
                   }
               }
           ).then(response => (console.log(response)));
       },
   },
   created() {
       
   }
};

サーバー側（APIルーター）

Route::middleware('auth:api')->put('/path', 'UserController@update'); // LaravelはPUTメソッドとして解釈してくれる

サーバー側（コントローラー）

<?php

namespace App\Http\Controllers;

use Illuminate\Http\Request;
use App\User;

class UserController extends Controller
{
   public function update(Request $request)
   {
       // いろんな処理
       return $request;
   }
}