I have a form in client which is upload a file
<form method="post" action="/">
<input type="file"/>
</form>
how can I read a data content and binary data content with this file in server using nodeJS and Express?? Like this...
app.get('/',(req, res) => {
//handle data content
//handle binary data content
}
Use ExpressJS middleware, like multer.
Note: the examples that follow are NOT intended to be used in production environments. Neither the HTML code nor the express js backend employs any kind of security. Using this example in a production environment would leave your system and possibly your network wide open to attacks.
Also note: I assume you have some very basic familiarity with express js, including how to make simple GET and POST routes.
Suppose I have a page with this simple HTML, which allows a person to upload any file of any type and size to my website:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Upload file to ExpressJS backend</title>
</head>
<body>
<form enctype="multipart/form-data" action="/do-upload" method="post">
<input type="file" name="file_from_user"/>
<input type="submit" value="Submit"/>
</form>
</body>
</html>
The <form ...> specifies that it will upload a multipart/form-data payload to my /do-upload endpoint in the form of a POST http request. So, on my server I need to...
/do-upload endpoint./do-upload endpoint to accept POST http requests./do-upload endpoint to accept multipart/form-data.Items 1 and 2 are solved quite easily with plain old express js routing.
The hard part is item 3, if we're limited to only express js. Thankfully, we're not limited, and so we'll use multer middleware. Multer automatically knows how to take in multipart form-data and decipher file uploads from it (the exact mechanics of how files are uploaded through multipart form-data requests is a challenge I leave you, the reader, to discover).
We'll create our /do-upload route, inject a multer middleware instance into it, and then do something when someone tries to upload a file. Here's the code:
var express = require('express'),
multer = require('multer'),
// Set up the middleware, which automatically handles files uploaded to it.
// The "dest" property specifies the location to save uploaded files.
// You will need to make sure this directory exists.
upload_middleware = multer({dest: 'tmp/uploads/'}),
app = express(),
// This is the name of the <input> element from the HTML that will
// send the file to the server.
form_element_name = 'file_from_user';
// The second parameter is how one injects middleware into a route in express js.
app.post('/do-upload', upload_middleware.single(form_element_name), function (request, response) {
console.log('Got a file!');
// The multer middleware adds the "file" property
// to the request object. The file property contains useful
// information about the file that was uploaded.
console.log('The original filename was: "%s".', request.file.originalname);
console.log('I saved the file to: %s.', request.file.path);
console.log('The file is %s bytes in size.', request.file.size);
// Finish the request with an HTTP 200 code and an informative message, so we don't leave user
// hanging in his or her browser.
response
.status(200)
.send('File uploaded successfully!');
});
// ... other routes
// ... app.listen call that starts your server
Getting express js to easily accept a single file upload and then stash sad upload somewhere in a directory is really that simple. As I said, though, this is not production-ready. It needs security, which I leave as a challenge for you to figure out.
Sources and further reading:
