首页 > 解决方案 > multer req.files.filename 始终未定义

问题描述

尝试使用 multer 使用 Angular nodejs express mongodb 上传文件,该行被添加并且文件出现在“上传”文件夹中,但 req.files.filename 返回 undefined

这是我的 api.js

const storage = multer.diskStorage({
    destination: (req, file, callBack) => {
        -callBack(null, "./uploads/");
        +callBack(null, "uploads/")
    },
    filename: (req, file, callBack) => {
        const name = file.originalname
        callBack(null, name); 
    }
})

router.post('/create',multer({ storage : storage}).any(), (req, res) => {
    const url = req.protocol + '://'+ req.get("host");  
    var tc = new Testcase({
        name: req.body.name,
        upload: url + "/uploads/" + req.files.filename ,
        run: req.body.run,
        modify: req.body.modify,
        delete: req.body.delete,
        step1: req.body.step1,
        step2: req.body.step2,
        step3: req.body.step3,
        step4: req.body.step4,
        step5: req.body.step5,
        step6: req.body.step6,
        step7: req.body.step7,
    });
    
    console.log(req.files.filename);
    tc.save((err, doc) => {
        if (err) { res.status(401).send("error") }
        else { 
            res.status(200).send(doc)
        }
    });
});

我的 api.service.ts

 private create = 'http://localhost:5555/testcase/create';

postTestCase(testcase,file:File) {
   const formData  = new FormData();
   formData .append('file', file);
   formData .append('name', testcase.name);
   formData .append('step1', testcase.step1);
   formData .append('modify', testcase.modify);
   formData .append('run', testcase.run);
   formData .append('delete', testcase.delete);
   formData .append('step2', testcase.step2);
   formData .append('step3', testcase.step3);
   formData .append('step4', testcase.step4);
   formData .append('step5', testcase.step5);
   formData .append('step6', testcase.step6);
   formData .append('step7', testcase.step7);

   return this.http.post<any>(this.create, formData   );
 }

这是 component.ts 代码:

addtestcaseData = {'name': '',
  'step1': '',
  
  'modify': '',
  'run': '',
  'delete': '',
  'upload': File = null,
  'step2': '',
  'step3': '',
  'step4': '',
  'step5': '',
  'step6': '',
  'step7':''}

addtestcase(){
    this.testcaseService.postTestCase(this.addtestcaseData,this.addtestcaseData.upload)
    .subscribe(
      res => {
        console.log(res)
        this._router.navigate(['/admin'])
      },
      err => {
        console.log(err);
        
        
      }
    )     
  };

对于我在表单中添加的 html (enctype="multipart/form-data") 但仍然没有运气

标签: node.jsangularmongodbexpressmulter

解决方案


你的 req.files 是一个数组,你可以遍历它并像这样提取它们:

   let fileNames = []
    req.files.forEach((file)=> {
       fileName.push(file.fileName)
    }

然后您可以将此数组保存为您在 mongodb 中的帖子图像


推荐阅读