Estoy enviando un formulario que debe hacerse vía axios (originalmente se enviaba como un formulario tradicional usando el método post). El problema es que no estoy logrando enviar la imagen a laravel, obtengo null o la validación falla con status 422.
El input de la imagen es el siguiente:
<form id="groups-form" method="POST" action="{{route('groups.store')}}" enctype="multipart/form-data">
<input id="thumbnail" type="file" name="thumbnail">
Y en la parte de axios lo siguiente:
let name = $("#name").val();
let groupsRequest = $("#groups").val();
let thumbnail = $("#thumbnail").val();
axios({
method: 'post',
headers: {
'Content-type' : 'multipart/form-data'
},
url: '{{route('groups.store')}}',
data: {
'name': name,
'groups' : groupsRequest,
'thumbnail' : thumbnail
},
})
El controlador lo tengo así:
$imageUrl = $this->uploadImage($locationGroupRequest);
$groupId = $this->groupRepository->saveGroup($locationGroupRequest, $imageUrl);
return response()->json(['success', compact('groupId')]);
La función uploadImage
es esta:
if ($locationGroupRequest->has('thumbnail')) {
$validator = Validator::make($locationGroupRequest->all(), [
'thumbnail' => 'image|mimes:jpeg,png,jpg,gif,svg|max:2048'
]);
if ($validator->fails()) {
return redirect()->back()
->withErrors($validator)
->withInput();
}
$file = $locationGroupRequest->file('thumbnail');
$extension = $file->getClientOriginalExtension();
$filenameToStore = $locationGroupRequest->input('name') . '.' . $extension;
return $this->compressImage($file, $filenameToStore);
} else {
return '';
}
Cabe recalcar que todo en la parte del servidor en laravel ya estaba funcionando de manera correcta antes de intentar usar axios.
formData()
y enviarlo en lugar delval()
let formData = new FormData();
luego agrégale el campo así,formData.append('thumbnail', $("#thumbnail").val())
y el tu data de axios envías el objeto que acabas de crear, o seaformData
. Prueba estodata: formData
junto con tus headers y el resto claro, puedes hacer que se agregue el valor del input al FormData con cada eventoonchange
ejemplo