나는 익스프레스 4.0 간단한 파일 업로드 메커니즘 작업을 진행하려고 해요하지만 난 점점 계속 undefined
에 대한 req.files
에 app.post
몸. 관련 코드는 다음과 같습니다.
var bodyParser = require('body-parser');
var methodOverride = require('method-override');
//...
app.use(bodyParser({ uploadDir: path.join(__dirname, 'files'), keepExtensions: true }));
app.use(methodOverride());
//...
app.post('/fileupload', function (req, res) {
console.log(req.files);
res.send('ok');
});
.. 및 해당 퍼그 코드 :
form(name="uploader", action="/fileupload", method="post", enctype="multipart/form-data")
input(type="file", name="file", id="file")
input(type="submit", value="Upload")
솔루션 아래 mscdex
의 응답 덕분에 대신 다음 을 사용으로 전환했습니다 .busboy
bodyParser
var fs = require('fs');
var busboy = require('connect-busboy');
//...
app.use(busboy());
//...
app.post('/fileupload', function(req, res) {
var fstream;
req.pipe(req.busboy);
req.busboy.on('file', function (fieldname, file, filename) {
console.log("Uploading: " + filename);
fstream = fs.createWriteStream(__dirname + '/files/' + filename);
file.pipe(fstream);
fstream.on('close', function () {
res.redirect('back');
});
});
});
답변
이 body-parser
모듈은 multipart가 아닌 JSON 및 urlencoded 양식 제출 만 처리합니다 (파일을 업로드하는 경우에 해당).
다중를 들어, 사용과 같은 것을 필요할 것 connect-busboy
또는 multer
나 connect-multiparty
(다자간가 / 강력한 원래 명시 bodyParser 미들웨어에 사용 된 것입니다). 또한 FWIW, 나는이라는 버스 보이의 최상위 계층에서 작업하고 reformed
있습니다. Express 미들웨어와 함께 제공되며 별도로 사용할 수도 있습니다.
답변
내가 찾은 인터넷 검색 결과는 다음과 같습니다.
var fileupload = require("express-fileupload");
app.use(fileupload());
업로드를위한 매우 간단한 메커니즘입니다.
app.post("/upload", function(req, res)
{
var file;
if(!req.files)
{
res.send("File was not found");
return;
}
file = req.files.FormFieldName; // here is the field name of the form
res.send("File Uploaded");
});
답변
그것은처럼 보이는 body-parser
한 익스프레스 3에서 지원 업로드 파일을하지만,이 경우 지원 익스프레스 4 감소되지 않았다 더 이상 종속성으로 연결을 포함
mscdex의 답변에서 일부 모듈을 살펴본 결과 express-busboy
훨씬 더 나은 대안이며 드롭 인 대체품에 가장 가까운 것으로 나타났습니다 . 내가 발견 한 유일한 차이점은 업로드 된 파일의 속성에 있습니다.
console.log(req.files)
사용 체내 파서 (특급 3)의 출력과 같이 보인다고 개체 :
{ file:
{ fieldName: 'file',
originalFilename: '360px-Cute_Monkey_cropped.jpg',
name: '360px-Cute_Monkey_cropped.jpg'
path: 'uploads/6323-16v7rc.jpg',
type: 'image/jpeg',
headers:
{ 'content-disposition': 'form-data; name="file"; filename="360px-Cute_Monkey_cropped.jpg"',
'content-type': 'image/jpeg' },
ws:
WriteStream { /* ... */ },
size: 48614 } }
고속 버스 보이 를 console.log(req.files)
사용 하는 것과 비교 (Express 4) :
{ file:
{ field: 'file',
filename: '360px-Cute_Monkey_cropped.jpg',
file: 'uploads/9749a8b6-f9cc-40a9-86f1-337a46e16e44/file/360px-Cute_Monkey_cropped.jpg',
mimetype: 'image/jpeg',
encoding: '7bit',
truncated: false
uuid: '9749a8b6-f9cc-40a9-86f1-337a46e16e44' } }
답변
1) 파일이 클라이언트 쪽에서 실제로 전송되었는지 확인하십시오. 예를 들어, 당신은 크롬 콘솔에서 확인할 수 있습니다 :
스크린 샷
2) NodeJS 백엔드의 기본 예는 다음과 같습니다.
const express = require('express');
const fileUpload = require('express-fileupload');
const app = express();
app.use(fileUpload()); // Don't forget this line!
app.post('/upload', function(req, res) {
console.log(req.files);
res.send('UPLOADED!!!');
});
답변
멀터 는 “multipart / form-data”를 처리하고 마술처럼 & 업로드 된 파일 및 양식 데이터를 request.files 및 request.body로 요청하여 우리에게 제공하는 미들웨어입니다.
멀터 설치 :- npm install multer --save
.html 파일에서 :-
<form method="post" enctype="multipart/form-data" action="/upload">
<input type="hidden" name="msgtype" value="2"/>
<input type="file" name="avatar" />
<input type="submit" value="Upload" />
</form>
.js 파일에서 :-
var express = require('express');
var multer = require('multer');
var app = express();
var server = require('http').createServer(app);
var port = process.env.PORT || 3000;
var upload = multer({ dest: 'uploads/' });
app.use(function (req, res, next) {
console.log(req.files); // JSON Object
next();
});
server.listen(port, function () {
console.log('Server successfully running at:-', port);
});
app.get('/', function(req, res) {
res.sendFile(__dirname + '/public/file-upload.html');
})
app.post('/upload', upload.single('avatar'), function(req, res) {
console.log(req.files); // JSON Object
});
도움이 되었기를 바랍니다!
답변
아래 코드를 사용하십시오
app.use(fileUpload());
답변
문제 해결됨 !!!!!!!
아웃 턴 storage
기능은 한 번도 실행하지 않았다. 내가 app.use(upload)
같이 포함해야했기 때문에upload = multer({storage}).single('file');
let storage = multer.diskStorage({
destination: function (req, file, cb) {
cb(null, './storage')
},
filename: function (req, file, cb) {
console.log(file) // this didn't print anything out so i assumed it was never excuted
cb(null, file.fieldname + '-' + Date.now())
}
});
const upload = multer({storage}).single('file');