0

I'm implementing an application using react-filepond where once the user selects/drops the files, i need to get uris (for the files) for upload from an endpoint(server), and then using those uris to upload to our storage.(whilst also showing upload progress to the user)

is using onupdatefiles prop to send getURIs request and then using onprocessfile/onprocessfilestart to upload those files using the retrieved URIs, the best way to do this?

also what is the use of the progess parameter we get in the onprocessfileprogress(file,progress)? can it to be used to feedback the progress back to filepond component?

1 Answers1

0

I think you can implement a custom server.process function and handle all upload logic in there, wether uploading to your local server of first uploading to a remote server it should give you enough control over the entire process. https://pqina.nl/filepond/docs/patterns/api/server/#process-1

Rik
  • 3,328
  • 1
  • 20
  • 23
  • I'm trying to implement this for uploading multiple files. so does server.process gets each file as a parameter and runs for every file I've added? – Michael Jernil Mar 11 '19 at 09:23
  • Can i call the this.filepond.setOptions from inside onupdatefiles callback prop? – Michael Jernil Mar 11 '19 at 10:15
  • Why would you want to do that? – Rik Mar 11 '19 at 10:25
  • I'm getting cloud storage URIs for multiple files(from the server) in onupdatefiles() with one request and then, i want to use these URIs to upload each file. also, can i do the setOptions anywhere outside the filepond component once i get the ref from oninit() ? – Michael Jernil Mar 11 '19 at 10:28
  • will the process method be called after onupdatefiles() ? .. because i can store my URIs there( i.e onupdatefiles ) in my local state, and then use it in 'process' to upload each file – Michael Jernil Mar 11 '19 at 10:45
  • where and on what do i call the setOptions in react? .. i think this will clear it up a bit for me – Michael Jernil Mar 11 '19 at 11:29
  • yes, it will be called after `onupdatefiles`. You can basically call `setOptions` it wherever you like but depending on where you call it, it could have side effects. – Rik Mar 11 '19 at 15:07
  • Could you send me an example code of the setOptions usage in React? pretty confusing while trying to do in render method. – Michael Jernil Mar 12 '19 at 10:56
  • Actually, i think i got it. your first answer is what i think would suit my case. implementing all my needed logic inside server.process. In React, I'm implementing it in the FilePond component prop 'server'. ` { //upload logic } }} />` – Michael Jernil Mar 13 '19 at 06:55
  • is there an event (or callback) to know when all files I've selected at once has been uploaded? – Michael Jernil Mar 13 '19 at 07:34