1 year ago
#387253
EduardoK
Upload file with FilePond
I'm trying to make a file upload system following the tutorial found here: https://www.youtube.com/watch?v=GRXaCfS1qj0 I've followed the tutorial step by step, but i'm having troubles.. I'm getting this message in console:
filepond.js:4696 POST http://localhost:8080/upload 404 (Not Found)
The error is simple, but the thing is, i've followed the steps, so i don't actually know whats going on..
My web.php file has this:
<?php
use Illuminate\Support\Facades\Route;
Auth::routes();
Route::post('upload', [UploadController::class, 'store']);
The upload controller is this:
<?php
namespace App\Http\Controllers;
use Illuminate\Http\Request;
class UploadController extends Controller
{
public function store(Request $request){
if ($request->hasFile('avatar')){
$file = $request->file('avatar');
$filename = $file->getClientOriginalName();
$folder = uniqid() . '-' . now()->timestamp;
$file->storeAs('avatars/tmp' . $folder, $filename);
return $folder;
}
return '';
}
}
And my blade file has this:
<input type="file" name="avatar" id="avatar">
@section('scripts')
<script>
const inputElement = document.querySelector('input[id="avatar"]');
const pond = FilePond.create(inputElement);
FilePond.setOptions({
server: {
url: '/upload',
headers: {
'X-CSRF-TOKEN': '{{ csrf_token() }}'
}
}
})
</script>
@endsection
My question is: is the problem only the folders, or am i missing something ?
RESOLVED: If someone in the future struggles with this, the problem was in this script:
FilePond.setOptions({
server: {
url: 'upload',
headers: {
'X-CSRF-TOKEN': '{{ csrf_token() }}'
}
}
})
Where i just had to remove the "/" in the "url: '/upload'".. In the video, he puts the "/", but for some reason, im my case, this was causing the problem.
laravel
upload
filepond
0 Answers
Your Answer