Node js Express Busboy Upload File Image Example

Node js Express Busboy Upload File Image Example

Upload image file in NodeJS express busboy; In this tutorial guide, you will learn how to upload image file in node js express framework using busboy package.

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.

It’s easy to setup busboy and start reading the incoming request. But, it’s a little trickier to terminate busboy and prevent reading the request any further. You might need to prematurely terminate the processing in case an internal error happens in your app or you notice the received data is invalid. Then you’d want to send the HTTP response as soon as possible and not waste any resources processing the request further.

node.js – Upload file using Express js and BusBoy

Let’s follow the following steps to upload image file in node js express js using busboy library:

  • Step 1 – Create Node Express js App
  • Step 2 – Install express and Busboy dependencies
  • Step 3 – Create File/image Upload Form
  • Step 4 – Create Server.js File
  • Step 5 – Start Node Express Js App Server

Step 1 – Create Node Express js App

Execute the following command on terminal to create node js app:

mkdir my-app
cd my-app
npm init -y

Step 2 – Install express and Busboy dependencies

Execute the following command on terminal to install express and busboy dependencies:

npm install express

npm install busboy

Step 3 – Create File/image Upload Form

Create a form with a `file input` element that allows us to choose the file and a button to submit the form:

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 and form method should be post

Step 4 – Create Server.js File

Create server.js file and import express, busboy, path dependencies in server.js; as shown below:

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 = 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);    
});
 
// 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');
});

Click to know more about the express

Step 5 – Start Node Express Js App Server

You can use the following command to run 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 Busboy Upload File/Image Tutorial with Example will look like:

node js file upload preview

Conclusion

In this tutorial, you have learned how to upload files and images in node js express framework.

Recommended Node JS Tutorials

AuthorAdmin

My name is Devendra Dode. I am a full-stack developer, entrepreneur, and owner of Tutsmake.com. I like writing tutorials and tips that can help other developers. I share tutorials of PHP, Python, Javascript, JQuery, Laravel, Livewire, Codeigniter, Node JS, Express JS, Vue JS, Angular JS, React Js, MySQL, MongoDB, REST APIs, Windows, Xampp, Linux, Ubuntu, Amazon AWS, Composer, SEO, WordPress, SSL and Bootstrap from a starting stage. As well as demo example.

3 replies to Node js Express Busboy Upload File Image Example

  1. 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

  2. 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.

Leave a Reply

Your email address will not be published. Required fields are marked *