Send blob data to node using fetch, multer, express
I was just able to run a minimum configuration of your above example and it worked fine for me.
Server:
var express = require('express');var multer = require('multer');var app = express();app.use(express.static('public')); // for serving the HTML filevar upload = multer({ dest: __dirname + '/public/uploads/' });var type = upload.single('upl');app.post('/api/test', type, function (req, res) { console.log(req.body); console.log(req.file); // do stuff with file});app.listen(3000);
HTML file in public
:
<script>var myBlob = new Blob(["This is my blob content"], {type : "text/plain"});console.log(myBlob);// here unnecessary - just for testing if it can be read from local storagelocalStorage.myfile = myBlob;var fd = new FormData();fd.append('upl', localStorage.myfile, 'blobby.txt');fetch('/api/test',{ method: 'post', body: fd}); </script>
The console.log(myBlob);
on the frontend is printing Blob {size: 23, type: "text/plain"}
. The backend is printing:
{}{ fieldname: 'upl', originalname: 'blobby.txt', encoding: '7bit', mimetype: 'text/plain', destination: '/var/www/test/public/uploads/', filename: 'dc56f94d7ae90853021ab7d2931ad636', path: '/var/www/test/public/uploads/dc56f94d7ae90853021ab7d2931ad636', size: 23 }
Maybe also try it with a hard-coded Blob like in this example for debugging purposes.