Up next in 10
Node.js busboy Library to Parse & Upload Files to Server Using HTML Form in Browser Using Express
0 views
Jun 7, 2025
Get the full source code of the application here: Official Website: https://freemediatools.com
View Video Transcript
0:03
uh hello guys welcome to this live
0:05
stream so in this live stream I will
0:07
show you how to upload the files to the
0:10
server inside NodeJS and Express and for
0:13
this we will be using a new package uh
0:15
today so which is bus boy so this is
0:19
essentially this package the command is
0:21
simple to install this package which is
0:23
npmi bus boy it's a very old package
0:28
very popular package as well with almost
0:31
17 million weekly downloads so it
0:34
actually this is actually a module which
0:36
parses the incoming HTML form data which
0:39
is coming so we will have a simple form
0:42
where we allow the user to upload files
0:45
directly into the server so let me show
0:47
you the demo of this application that we
0:48
are building so as you can see we have a
0:51
simple form right here we have created
0:54
this directory here uploads directory
0:56
where all the files which will be
0:57
uploaded will be directly uploaded in
1:00
the stored inside this folder so we have
1:03
the simple form right here choose file
1:06
button is there and we have this upload
1:08
button so as I click the choose file
1:11
button you will be able to
1:13
select any file it can be image it can
1:16
be
1:17
video so let me select this image file
1:20
JPG image file so as soon as I click
1:22
upload button you will see you will get
1:24
this notification that your file is
1:26
uploaded
1:27
successfully and if you check the
1:30
directory you will see inside the
1:32
uploads directory this file is received
1:36
this image file has been received if I
1:39
again do the process once again choose
1:42
the file that I need to
1:44
upload once again click upload you will
1:46
see the file will get uploaded and it
1:49
will be stored inside this uploads
1:50
directory so now I will show you how to
1:53
get started here so just install this
1:56
module and after
1:58
that I will start it from scratch so let
2:02
me just delete
2:04
everything so here you first of all need
2:07
to import all the packages which are
2:09
required for this application so we
2:11
simply first of all require the express
2:14
module which is used to build out the
2:17
web server and then we import this
2:20
package bus boy like
2:23
this so we simply use the required
2:26
statement we actually require this
2:29
module and we import the express module
2:32
as well so after that a bunch of other
2:35
modules are required which is the path
2:37
module which is a built-in module and
2:39
also we need the file system module as
2:42
well which is again a built-in module
2:44
and then we will construct a very simple
2:47
express app and this app will be
2:49
listening on port number
2:51
5,000 so we'll use the listen method so
2:55
and inside this call back function we
2:57
can show a simple console lock app is
3:00
listening on port 5,000 so after that we
3:04
can actually show a simple HTML form so
3:07
when
3:09
the user opens the homepage this call
3:13
back function will execute and inside
3:15
this we can show the HTML file right
3:18
here this will be present in the same
3:21
directory so let me call this file as
3:23
index html so here you just need to
3:26
create this file in the root directory
3:28
so simply make index html file so this
3:32
file will contain a simple form HTML
3:35
form where the user will upload the file
3:40
so right here you will have a simple
3:42
form
3:44
tag and here the method will be of post
3:48
and encoding type multiart form data so
3:51
whenever we are working with files you
3:53
need to give this attribute so this will
3:56
be making a simple post request and
3:59
inside this form we will have a
4:01
simple input type file give it a name
4:05
attribute as well and after that we
4:08
having a simple button which will say
4:10
upload button type submit so this is
4:15
actually a simple form so if I try to
4:18
open this application by visiting
4:21
localhost 5000 you will see this form
4:23
will appear we have this choose file
4:26
button and then we have the upload
4:27
button so if you try to select a file
4:31
now click on the upload button you will
4:34
get this error message cannot post we
4:38
cannot get this post request so right in
4:42
the form you just need to add this
4:44
action attribute so this action
4:46
attribute tells the form where to go
4:49
when the file is uploaded so you will
4:53
basically go to this route
4:56
/upload now we just need to make this
4:59
route in the express app right here so
5:02
right here make this post route
5:06
/upload so this will be again request
5:09
response so now inside this we need to
5:12
upload the
5:13
file and for uploading the file we need
5:16
to initialize the bus boy
5:19
library using this so we already
5:22
imported this package early on so we are
5:24
simply instantiating this header and
5:27
this takes a property here which is
5:29
headers and here you just need to pass
5:32
the request headers which are there and
5:35
in this way you can initialize this
5:37
library after initializing it it has a
5:40
bunch of call back functions that you
5:42
can listen on one such call back
5:44
function is on function so here you can
5:47
listen for all these bunch of events one
5:50
such event is this file event so when
5:53
the file is uploaded then we have can
5:57
get this bunch of properties related to
5:59
the file the name of the file the
6:02
information related to the file so right
6:05
here inside this we
6:08
will write the code for where to save
6:11
this file so we already created this
6:14
uploads directory so we are simply
6:16
mentioning this we need to save it
6:18
inside this uploads directory and then
6:21
we can give it a file name random file
6:24
name so we are using the date
6:27
constructor this will give it a random
6:29
file name whenever the file is uploaded
6:32
it will store inside this uploads
6:34
directory just create a uploads
6:36
directory where all the files will be
6:39
uploaded after that we just need to pipe
6:42
this
6:43
file and for this we'll using the file
6:46
system module to
6:48
create this right
6:51
stream to this location so this will
6:54
actually save the file to that physical
6:56
location using the file system module
6:58
that we already
7:00
imported so that's all that we need to
7:03
do and also it contains another call
7:05
back function which we can listen by
7:07
using dot on and this one is for close
7:11
so now for closing the file we write
7:13
this code here and we can send out a
7:16
simple message to the user that your
7:18
file is successfully uploaded so right
7:20
here we can send out a simple message
7:22
that file uploaded
7:25
successfully and now at the last we just
7:28
need
7:29
to pipe this
7:32
response to the bus boy library so
7:36
requestpipe bus voice this is the
7:40
variable that we are doing that's all
7:42
that we need to do this application is
7:44
complete so if you try to test this
7:47
application once again refresh and you
7:49
would get this choose file button and
7:51
just choose this any file here click on
7:55
the upload button as soon as you do this
7:57
you will get this message that your file
7:59
is uploaded successfully and if you also
8:02
check the directory here you will see
8:03
this file will be received automatically
8:07
so in this easy way you can use this
8:09
library for file uploads inside NodeJS
8:13
express and once again if I go and
8:16
select a different file click upload so
8:19
once again you will see the second file
8:22
will be received so in this easy way you
8:25
can upload files inside NodeJS and
8:28
express using
8:29
bus and also check out my website guys
8:32
free media tools.com uh which contains
8:36
uh unlimited number of tools regarding
8:38
audio video and
8:40
image and I will be seeing you in the
8:44
next video