To upload image file in node express js using busboy; Simply install busboy module in node express js app and use busboy.on('file', (fieldname, file, filename, encoding, mimetype) => {const saveTo = path.join(__dirname, 'uploads', filename.filename); file.pipe(fs.createWriteStream(saveTo)); });
with your application route to upload files in your application.
Busboy is an event-based streaming parser that’s not tied to node Express.js. Instead of storing intermediate files, it provides a stream to the incoming file. It’s been around since 2013. The core multipart/form-data implementation has been extracted to a separate dicer
module.
Node.js Upload file using Express js and BusBoy
Steps to upload image file in node express js using busboy library:
Step 1 – Create Node Express js App
Simply open your cmd or terminal window and run the following commands into it to create node expres js application:
mkdir my-app cd my-app npm init -y mkdir uploads
Step 2 – Install express and Busboy Module
To install express and busboy module; Simply run npm install express
and npm install busboy
command on cmd or terminal window:
npm install express npm install busboy
Step 3 – Create File Upload Form
To create a form with a `file input` element that allows us to choose the file and a button to submit the form; like following:
app.get('/', function (req, res) { res.writeHead(200, {'Content-Type': 'text/html'}); res.write('<form action="fileupload" method="post" enctype="multipart/form-data">'); res.write('<input type="file" name="filetoupload"><br>'); res.write('<input type="submit">'); res.write('</form>'); return res.end(); })
Make sure your form must have enctype="multipart/form-data"
attribute with form method.
Step 4 – Create File Upload Route
To create route to upload image file in your node express js application; Like following:
app.post('/fileupload', function (req, res) { var busboy = new Busboy({ headers: req.headers }); busboy.on('file', function(fieldname, file, filename, encoding, mimetype) { var saveTo = path.join(__dirname, 'uploads/' + filename); file.pipe(fs.createWriteStream(saveTo)); }); busboy.on('finish', function() { res.writeHead(200, { 'Connection': 'close' }); res.end("That's all folks!"); }); return req.pipe(busboy); });
Step 5 – Import Module and Route in Server.js
To create server.js file, and import express, busboy, path and routes into it to upload images files: Like following:
var http = require('http'), express = require('express'), Busboy = require('busboy'), path = require('path'), fs = require('fs'); var app = express(); app.get('/', function (req, res) { res.writeHead(200, {'Content-Type': 'text/html'}); res.write('<form action="fileupload" method="post" enctype="multipart/form-data">'); res.write('<input type="file" name="filetoupload"><br>'); res.write('<input type="submit">'); res.write('</form>'); return res.end(); }) app.post('/fileupload', function (req, res) { var busboy = Busboy({ headers: req.headers }); busboy.on('file', function(fieldname, file, filename, encoding, mimetype) { var saveTo = path.join(__dirname, 'uploads/' + filename.filename); file.pipe(fs.createWriteStream(saveTo)); }); busboy.on('finish', function() { res.writeHead(200, { 'Connection': 'close' }); res.end("That's all folks!"); }); return req.pipe(busboy); }); // port must be set to 3000 because incoming http requests are routed from port 80 to port 8080 app.listen(3000, function () { console.log('Node app is running on port 3000'); });
Step 6 – Start Node Express Js App Server
To run the npm start
to run the development server:
//run the below command npm start after run this command open your browser and hit http://127.0.0.1:3000/
Node js Express Upload File Image using Busboy will look like:
Conclusion
In this tutorial, you have learned how to upload files and images in node js express framework.
Hi, great tutorial. How can I edit to allow multiple files selected? It will only allow me to upload one file at a time.
Thanks
I get this error:
Node app is running on port 3000
TypeError: Busboy is not a constructor
at /home/felipe/Desktop/myapp/server.js:19:18
at Layer.handle [as handle_request] (/home/felipe/Desktop/myapp/node_modules/express/lib/router/layer.js:95:5)
at next (/home/felipe/Desktop/myapp/node_modules/express/lib/router/route.js:144:13)
at Route.dispatch (/home/felipe/Desktop/myapp/node_modules/express/lib/router/route.js:114:3)
at Layer.handle [as handle_request] (/home/felipe/Desktop/myapp/node_modules/express/lib/router/layer.js:95:5)
at /home/felipe/Desktop/myapp/node_modules/express/lib/router/index.js:284:15
at Function.process_params (/home/felipe/Desktop/myapp/node_modules/express/lib/router/index.js:346:12)
at next (/home/felipe/Desktop/myapp/node_modules/express/lib/router/index.js:280:10)
at expressInit (/home/felipe/Desktop/myapp/node_modules/express/lib/middleware/init.js:40:5)
at Layer.handle [as handle_request] (/home/felipe/Desktop/myapp/node_modules/express/lib/router/layer.js:95:5)
Look, node_modules doesn’t only contain the packages, which you installed, it also contains dependencies of your installed packages. So a good practice is to use lock files as package-lock.json, which will lock every package’s version and every time you run npm install it installs the exact locked versions (to be more precise – with npm ci script). So in this case as I see one of your packages has been updated or maybe that “busboy” package has been updated and after you ran install script it brought to you the updated package (or packages) which involves this error.