Dark

Upload files with Fetch - JavaScript Tutorial

dcode
Subscribe
Views 7 365
99% 73 1

In this video we'll be taking a look at how to upload files using the Fetch API - this works by using the FormData object within JavaScript.
Support me on Patreon:
www.patreon.com/dcode - with enough funding I plan to develop a website of some sort with a new developer experience!
For your reference, check this out:
developer.mozilla.org/en-US/docs/Web/API/Fetch_API
Follow me on Twitter @dcode!
If this video helped you out and you'd like to see more, make sure to leave a like and subscribe to dcode!

Share:

Link:

Download:

Loading link...

Add to:

My playlist
Watch later
Comments 9
rave g
rave g 16 days ago
it's not working... I write this code just same as you are and set same directory, but I can't received image file in upload, cause they didn't send.
iam Nobody
iam Nobody Month ago
how to upload several files with this Fetch??
Greyce Riquinho
Greyce Riquinho 2 months ago
why am I only getting the 404 error saying (index):57 POST localhost:8080/upload 404 (Not Found)? it is exactly like yours. Maybe something with the server I am starting the application? Is there any video before this one teaching how to set up the server? Thanks!
Sebas Q
Sebas Q 5 days ago
You are missing the .php --> upload.php
DijiFlex CyberTech
DijiFlex CyberTech 3 months ago
So if i have the name attribute on on the input tag, does it mean i can now avoid using the formdata.append() ?
Vishnu Vardhan
Vishnu Vardhan 3 months ago
Hello! When I follow the same image not copied or saved or uploaded into destination folder.
Eugene Kurennyy
Eugene Kurennyy 6 months ago
Hello! May I ask you which VS Code them are you using in this video? Looks very nice!
dcode
dcode 6 months ago
I'm using Roboto Mono as the font and the theme is Min Dark.
Romi
Romi 6 months ago
Very well explained
dcode
dcode 6 months ago
Cheers mate!
Jose Raimundo Fernandes Filho
Hello dcode I really liked ur video. May I ask you how can I make the code version of upload.php in nodejs?
Jose Raimundo Fernandes Filho
​@dcode Hello dcode. I tried with angular + Express and connect-multiparty and its working but the file name is becoming a hash like: 2wrty267yw2.pdf. Do you know how can I fix that?
dcode
dcode 11 months ago
You can use Express and Multer :)
Bikram Chettri
Can you teach how to validate files using javascript?
Bikram Chettri
@dcode Thank buddy.
dcode
dcode Year ago
I'll be doing a video soon on the File API :)
Next videos
Naming My Pregnant Cat!
13:16
What is API ?
10:18
Views 1 200 000