so I'm uploading stream data inside multipart form-data
var Koa = require('koa');
var Router = require('koa-router');
const HttpStatus = require('http-status');
const fs = require('fs');
const koaBody = require('koa-body');
const request = require('request');
var FormData = require('form-data');
var formData = {
my_field: 'my_value',
my_file: fs.createReadStream('robot.jpg'),
};
request.post({url:'http://localhost:3456/fileStorage', formData: formData}, function(err, httpResponse, body) {
if (err) {
return console.error('upload failed:', err);
}
console.log('Upload successful! Server responded with:', body);
});
In the server side I tried koa-multer, get errors when trying to access the file. Just use the plain koa-body, I can see the file is uploaded, but cannot save it back to a file, any hints pls ?
{ my_file:
File {
domain: null,
_events: {},
_eventsCount: 0,
_maxListeners: undefined,
size: 15562,
path: '/var/folders/l6/lmwkwk196_qfxxngv5ys0lp00000gn/T/upload_fc48a19e6ee5abf8a9a361d784725b78',
name: 'robot.jpg',
type: 'image/jpeg',
...
}
The source is this
var Koa = require('koa');
var Router = require('koa-router');
const HttpStatus = require('http-status');
const fs = require('fs');
const koaBody = require('koa-body');
//const multiparty = require('multiparty');
//const multer = require('koa-multer');
var app = new Koa();
var router = new Router();
//const upload=multer({desk: './uploads/' });
router
.post(`/upload`, koaBody({multipart:true}),
(ctx) => {
console.log('----- hello ----');
console.log(ctx.request.body.files);
console.error('---------------');
const writeStream = fs.createWriteStream('./111.jpg');
ctx.request.body.files.my_file.pipe(writeStream);
});
app.use(router.routes());
app.use(router.allowedMethods());
app.listen(3456);
ok, I just did this
const readStream = fs.createReadStream(ctx.request.body.files.my_file.path);
so I can receive the file stream in the multipart from the http post.
Related
I am trying to upload a file to the API, sort the numbers and then return the result in another text file that is available to download. I upload the file, and when I start the calculation I get the Internal Server Error. The API is running on port 3000 and I start the React App.js on port 3001.
Is there something I'm doing wrong?
This is the API's app.js:
const express = require('express');
const multer = require('multer');
const bodyParser = require('body-parser');
const fs = require('fs');
const app = express();
const storage = multer.memoryStorage();
const upload = multer({ storage: storage });
app.use(bodyParser.text({ type: 'text/plain' }));
app.post('/sort', upload.single('inputFile'), (req, res) => {
console.log(req.file)
const input = req.file.buffer.toString().split('\n').map(Number);
const result = input.sort((a, b) => b - a);
const resultText = result.join('\n');
fs.writeFile('result.txt', resultText, (err) => {
if(err) throw err;
res.send('File succesfully sorted!');
});
res.set('Content-Type', 'text/plain');
res.send(resultText);
});
app.listen(3000, () => {
console.log('API is listening on port 3000');
});
This is the React App.js:
const [inputFile, setInputFile] = useState(null);
const [result, setResult] = useState(null);
const [processingTime, setProcessingTime] = useState(null);
const handleFileUpload = (event) => {
setInputFile(event.target.files[0]);
};
const startCalculation = async (event) => {
event.preventDefault();
const startTime = performance.now();
const formData = new FormData();
formData.append('inputFile', inputFile);
console.log(inputFile)
const response = await fetch("http://localhost:3000/sort", {
method: 'POST',
body: formData,
mode: 'no-cors',
});
const data = await response.text();
console.log(data);
setResult(data);
setProcessingTime(performance.now() - startTime);
};
const handleDownload = (event) => {
event.preventDefault();
const file = new Blob([result], {
type: 'text/plain'
});
const fileURL = URL.createObjectURL(file);
const link = document.createElement('a');
link.href = fileURL;
link.download = 'result.txt';
link.click();
};
The issue is on the client you are setting the input name to inputFile, however, on the backend you are telling Multer that the input name is myFile.
Change from this:
upload.single("myFile")
To this:
upload.single("inputFile")
I have a (React) js app that reads a PDF file using FileReader then uses fetch to send it to a node js server running Express. When the request is received on the server side, however, the request body is undefined. What is missing from my code for this to work?
Client side:
function readFile() {
let file = fileInputRef.current.files[0];
const reader = new FileReader();
return new Promise((resolve) => {
reader.onload = function (e) {
resolve(e.target.result);
};
reader.readAsDataURL(file);//readAsDataURL, readAsArrayBuffer, or readAsBinaryString?
});
}
function handleSubmit(event) {
event.preventDefault();
readFile().then((value) => {
fetch('/gen/file', {
method: 'POST',
body: value
})
});
Server side:
const express = require('express');
const path = require('path');
const bodyParser = require('body-parser')
const app = express();
const jsonParser = bodyParser.json()
const port = 3000;
app.post("/gen/file", function (req, res, next) {
console.log(req.body);//undefined - Why????
});
app.listen(port, function (err) {
if (err) console.log(err);
});
Client Side:
function getBase64(file,callback){
const reader = new FileReader();
reader.addEventListener('load',()=> callback(reader.result));
reader.readAsDataURL(file);
}
function handleSubmit(event) {
event.preventDefault();
let body = {};
getBase64(file,fileUrl=>{
body.file = fileUrl;
fetch('/gen/file', {
method: 'POST',
body
})
})
Server Side:
const express = require('express');
const path = require('path');
const bodyParser = require('body-parser')
const app = express();
const jsonParser = bodyParser.json()
const port = 3000;
const fs = require('fs');
app.post("/gen/file", function (req, res, next) {
console.log(req.body);//undefined - Why????
let file = req.body.file;
let base64 = file.match(/^data:([A-Za-z-+\/]+);base64,(.+)$/);
var buffer = new Buffer.from(base64[2],'base64');
fs.writeFile(__dirname+"/out.jpeg", buffer, 'base64', function (err) {
console.log(err);
});
});
I am having error uploading my file. I get response that i have a file in my request body but it doesn't get uploaded
My code
const fs = require('fs')
const express = require('express')
const app = express();
const fileUpload = require('express-fileupload')
var http = require('http')
// var stream = fs.createReadStream(__dirname+'/files/1576350919658.jpeg');
var path = require('path')
app.use(fileUpload())
app.post('/',(req,res,next)=>{
console.log(req.files)
let file = req.files.image;
file.mv(__dirname+'/files', (err)=>{
if(err){
return res.send(err)
}
return res.send('File Uploaded')
})
})
app.listen(2020)
console.log('listening')
Error:
{
"errno": -4068,
"code": "EISDIR",
"syscall": "open",
"path": "D:\\wd\\javascript\\Projects\\uploadFiles\\files"
}
const fs = require('fs')
const express = require('express')
const app = express();
const fileUpload = require('express-fileupload')
var http = require('http')
// var stream = fs.createReadStream(__dirname+'/files/1576350919658.jpeg');
var path = require('path')
app.use(fileUpload())
app.post('/',(req,res,next)=>{
console.log(req.files)
let file = req.files.image;
file.mv(__dirname+'/files/ddddd.jpg', (err)=>{
if(err){
return res.send(err)
}
return res.send('File Uploaded')
})
})
app.listen(2020)
console.log('listening')
convert you image into base64 data .
var base64Data = req.body.file_data // base64 string
var file_name='123.png';
var file_dir = "assets/client_folios/"
var fs = require("fs");
if (!fs.existsSync('assets/')){
fs.mkdirSync('assets/');
}
if (!fs.existsSync(file_dir)){
fs.mkdirSync(file_dir);
}
var file_path="assets/client_folios/"+file_name
var file_path="assets/client_folios/"+file_name
fs.writeFile(file_path, base64Data, 'base64',async function(err) {
}
This is what I want, server is a file server, when client asks for certain file, it'll stream that file back. Instead of koi-static, I try to do this, but the dest.jpg only contains 'Not found'.
client code:
var Koa = require('koa');
var Router = require('koa-router');
const HttpStatus = require('http-status');
const fs = require('fs');
const koaBody = require('koa-body');
const request = require('request');
const tempSaveFile = fs.createWriteStream('dest.jpg');
const writeStream = request.post('http://localhost:3456/getfile/src.jpg').pipe(tempSaveFile);
writeStream.on('finish', () => {
tempSaveFile.end();
console.log('Upload successful! ');
});
server code:
var Koa = require('koa');
var Router = require('koa-router');
const HttpStatus = require('http-status');
const fs = require('fs');
const koaBody = require('koa-body');
var app = new Koa();
var router = new Router();
const serve = require('koa-static');
router
.post([`/getfile/:fileName`],
(ctx) => {
const { params: { fileName } } = ctx;
console.error(`------- server will return ${fileName} --------`);
const readStream = fs.createReadStream(fileName).pipe(ctx.res);
readStream.on('finish', () => {
console.error('---- server finished stream ----');
ctx.status = HttpStatus.OK;
});
})
app.use(router.routes());
app.use(router.allowedMethods());
app.listen(3456);
When I change the server to use koa-static, client can gets the file successfully, did diff, look the same.
I suspect server returns too fast before it finishes, but another post said this is the way to wait for pipe to finish.
callback to handle completion of pipe
Any suggestions ? thanks !
ok, I added async, working now
const multiparty = require('multiparty');
const multer = require('koa-multer');
const request = require('request');
var app = new Koa();
var router = new Router();
const serve = require('koa-static');
const streamEnd = fd => new Promise((resolve, reject) => {
fd.on('end', () => {console.error('-- 51 --'); resolve(51); });
fd.on('finish', () => {console.error('-- 53 --'); resolve(53); });
fd.on('error', reject);
});
router
.get([`/getfile/:fileName`],
async (ctx) => {
const { params: { fileName } } = ctx;
console.error(`------- server will return ${fileName} --------`);
if (fs.existsSync(fileName)) {
const readStream = fs.createReadStream(fileName).pipe(ctx.res);
await streamEnd(readStream);
ctx.status = HttpStatus.OK;
} else {
console.error(`File ${fileName} doesnot exist`);
ctx.status = HttpStatus.INTERNAL_SERVER_ERROR;
}
})
app.use(serve('./customer'));
app.use(router.routes());
app.use(router.allowedMethods());
app.listen(3456);
I try to get the progression of my file uploading in node Js ... I use the form-data library integrated on request library ...
Is there any way to get my progression ?
var torrentStream = require('torrent-stream');
var express = require('express');
var http = require('http');
var request
var app = express();
var request = require('request');
var zipFolder = require('zip-folder');
var magnet = require('magnet-uri')
var FormData = require('form-data');
var fs = require('fs');
var formData = {
files : fs.createReadStream(__dirname + '/archive.zip')
};
request.post({url:'http://request.url', formData: formData},
function(err, httpResponse, body) {
if (err) {
return console.error('upload failed:', err);
}
console.log('Upload successful! Server responded with:', body);
});