LaravelでJavaScriptのfetchによる非同期ファイルアップロード方法
PHPのフレームワークLaravelでJavaScriptを使ってファイルを非同期でアップロード処理をする必要がありましたのでサンプルコードを掲載します。
※Laravel6以降で動作確認済み
const FileUploadFetch = (f) => {
var formData = new FormData();
formData.append('paramA', 'dataA');
formData.append('paramB', 'dataB');
formData.append('file', f);
fetch('/sample/upload', {
method: "POST",
body: formData,
credentials: "same-origin",
headers: {
'X-CSRF-TOKEN': '{{ csrf_token() }}'
},
})
.then((response) => response.json())
.catch(error => console.log('Error:', error))
.then((response) => {
console.log('Success:', JSON.stringify(response))
});
}