CODEWITHSUNDEEP
reactjsfilepond
vahid mokhtarzade
vahid mokhtarzade

Reputation: 15

Get blob of uploaded file by filepond

I'm using filepond to upload a file to server in react-js. everything works fine and I can upload the file successfully. but i need to keep the uploaded file in browser (or maybe the path of local file) so i can show it to user at next page. it seems that browsers do not show the absolute path of selected file (for security reasons). I wonder it is possible the blob of selected file. is there any solution? thanks

Upvotes: 0

Views: 2114

Answers (1)

hendra
hendra

Reputation: 2651

You can use URL.createObjectURL() to create a URL from your Blob or File. This url can be passed to the next screen.

const url = URL.createObjectURL(blob);

Depending on the type of file your can use the object url to display the file directly e.g. in an img-tag or you can convert it back into a blob.

<img src={url} />

or

const blob = await fetch(url).then(r => r.blob());

Upvotes: 1

Related Questions