I am using Laravel 5.3
.
And I use cropper
https://github.com/fengyuanchen/cropper to crop image and then upload it to back end via ajax.
$('#uploadAvatar').on('click', function (e) {
$("#image").cropper('getCroppedCanvas').toBlob(function (blob) {
var formData = new FormData();
formData.append('croppedImage', blob);
$.ajaxSetup({
headers: {
'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
}
});
$.ajax({
type: "POST",
url: "{{ url('/change-avatar') }}",
processData: false,
contentType: false,
data: formData
}).done(function (response) {
//...
}).fail(function (data) {
//...
});
});
});
the headers of ajax request is like this:
Laravel get the image and do something like this:
public function changeAvatar (Request $request)
{
$file = $request->croppedImage;
$input = array('image' => $file);
$rules = array(
'image' => 'image'
);
$validator = \Validator::make($input, $rules);
if ( $validator->fails() ) {
return \Response::json([
'success' => false,
'errors' => $validator->getMessageBag()->toArray()
]);
}
$destinationPath = '/images/uploads/';
$user=\Auth::user();
$fileName = $user->id . '_' . time() . '.'.$file->clientExtension();
$file->move($destinationPath, $fileName);
//dd($file);
$user ->avatar = $destinationPath.$fileName;
$user ->save();
return \Response::json([
'success'=>true,
'avatar'=>asset($destinationPath.$fileName),
]);
}
In above method, the line $file->move($destinationPath, $fileName);
not working.
Why is it?