Description
Is there an existing issue for this?
- I have searched the existing issues
Have you updated FilePond and its plugins?
- I have updated FilePond and its plugins
Describe the bug
I used filepond in my older projects and everything works great. Now we need gallery module on our new project and I thought Filepond will be the best solution, however, it doesn't work as expected anymore... The biggest issue is I can't load uploaded images via files
property. I am currently using vue-filepond v7.0.3
(on my older project, where everything works great, it's vue-filepond v6.0.3
).
All I get is 400 error "Can't load URL" without any useful error message to debug it. There are same issues reported regarding this, but they were just closed without proper solution, mentioning cors, which is not the problem here (browser would throw cors error in that case and it also wouldn't work on my old project which also doesn't have cors setup).
I am using it with Vue 3 and Inertia.js this time (older project is Vue 2) and this is my files property value:
Since the type is local
It should trigger server load
method, but it doesn't; it just triggers addfile
event...
This is my filepond vue component:
<FilePond
ref="filepondGalleryInput"
allow-paste="false"
allow-multiple="true"
allow-reorder="true"
:accepted-file-types="['image/jpeg']"
style-item-panel-aspect-ratio="1"
item-insert-location="before"
:files="filepondFiles"
@init="handleFilePondInit"
@addfile="handleFilePondGalleryAdd"
@removefile="handleFilePondGalleryRemoveFile"
credits=""
:label-idle="$t('filepond-label-idle')"
/>
handleFilePondInit:
handleFilePondInit: function () {
// Set global options on filepond init
setOptions({
server: {
process: "/filepond",
load: (source, load) => {
// This should trigger before addfile event and generate blobs for uploaded files, but it doesn't
console.log("load", source);
fetch(new Request(source)).then((response) => {
response.blob().then((blob) => load(blob));
});
},
headers: {
"X-CSRF-TOKEN": this.props.csrfToken,
},
},
});
},
On init it just logs this from my handleFilePondGalleryAdd method (you can see there is no log from load):
Reproduction
x
Environment
- OS: Windows 11
- Browser: Chrome 105