Express 4.0: req.files를 사용하여 파일 업로드가 정의되지 않았습니다.

Express 4.0: req.files를 사용하여 파일 업로드가 정의되지 않았습니다.

4하고 있지만 Express 4.0은 해서 사용할 수 있습니다.undefined위해서req.files에 시대에app.post 다은관코드니다입련음다:▁body▁the.

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

및 함께 제공되는 Pug 코드:

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

모듈은 JSON 및 URL 인코딩된 양식 제출만 처리하고 멀티파트는 처리하지 않습니다(파일을 업로드하는 경우).

멀티파트의 경우 , 또는 와 같은 것을 사용해야 합니다. (다자/다자는 원래 익스프레스 바디 파서 미들웨어에서 사용된 것입니다.)또한 FWIW, 저는 버스보이라는 이름의 더 높은 레벨의 레이어에서 일하고 있습니다.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");


});

파일이 클라이언트 측에서 전송되었는지 확인합니다.예를 들어 Chrome Console: 스크린샷에서 확인할 수 있습니다.

다음은 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!!!');
});

▁like처럼 보입니다.body-parser Express 3에서 파일 업로드를 지원했지만, Connect as dependency가 더 이상 포함되지 않을 때 Express 4에 대한 지원이 중단되었습니다.

mscdex의 답변에서 일부 모듈을 살펴본 후, 저는 그것이 훨씬 더 나은 대안이며 드롭인 교체에 가장 가까운 것이라는 것을 알게 되었습니다.제가 주목한 유일한 차이점은 업로드된 파일의 속성입니다.

console.log(req.files)본문 파서(Express 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)고속 버스 보이 사용(고속 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' } }

multter는 "multart/form-data"를 처리하고 업로드된 파일과 폼 데이터를 요청에 따라 당사에 제공하는 미들웨어입니다.파일 및 request.body.

multter 설치하기:-npm install multer --save

.vmx 파일:-

<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());

위의 답변에 추가하기 위해 사용을 간소화할 수 있습니다.express-fileupload모든 경로에 추가하는 대신 필요한 단일 경로로 이동합니다.

let fileupload = require("express-fileupload");

...

//Make sure to call fileUpload to get the true handler
app.post("/upload", fileupload(), function(req, res){

...

});

이 기능을 위해 패키지 설치가 필요합니다. 여러 가지 기능이 있지만 저는 개인적으로 "express-file updoad"를 선호합니다.터미널에 "npmi express-fileupload" 명령을 사용하여 이것을 설치하고 루트 파일에 사용합니다.

const fileUpload = require("express-fileupload");
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');

methodOverride middleware 이전에 multer를 글로벌 middleware로 추가했는데 라우터에서 작동했습니다.같이 넣어주세요.

const upload = multer({
    storage: storage
}).single('featuredImage');
app.use(upload);

app.use(methodOverride(function (req, res) {
  ...
}));

가공할 제품 포함:

const formidable = require('formidable');

app.post('/api/upload', (req, res, next) => {
  const form = formidable({ multiples: true });

  form.parse(req, (err, fields, files) => {
    if (err) {
      next(err);
      return;
    }
    res.json({ fields, files });
  });
});

https://www.npmjs.com/package/formidable

사용할 수 있습니다.express-fileupload다음과 같은 파일을 디코딩하는 npm 패키지

const fileUpload = require('express-fileupload');
app.use(fileUpload({useTempFile: true}))

참고: 이미지를 업로드하기 위해 cloudinary를 사용하고 있습니다.

여기에 이미지 설명 입력

const fileUpload = required "syslog-fileupload";

router.route("/업로드").post(파일업로드(), uploadProductImage);

//경로에 파일업로드() 미들웨어를 추가하는 것이 제게 도움이 되었습니다.

express-fileupload요즘도 작동하는 유일한 미들웨어인 것 같습니다.

같은 예를 들자면,multer그리고.connect-multiparty정의되지 않은 req.file 또는 req.file 값을 제공하지만express-fileupload작동하다.

그리고 req.file/req.file의 빈 값에 대해 많은 의문과 문제가 제기되고 있습니다.

언급URL : https://stackoverflow.com/questions/23114374/file-uploading-with-express-4-0-req-files-undefined