获取错误:尝试上载多个文件时出现意外字段

时间:2016-01-14 19:58:46

标签: angularjs node.js multer ng-file-upload

如果我在multer的自述文件中使用该示例,我可以毫无问题地上传单个文件。但是,当我使用相同的示例时,我无法对多个文件执行此操作。我试过使用常规

错误:意外字段     at makeError(/Users/mroker/node_projects/JWT_Auth_Basic/node_modules/multer/lib/make-error.js:12:13)     at wrappedFileFilter(/Users/mroker/node_projects/JWT_Auth_Basic/node_modules/multer/index.js:39:19)     在Busboy。 (/Users/mroker/node_projects/JWT_Auth_Basic/node_modules/multer/lib/make-middleware.js:112:7)     在emitMany(events.js:108:13)     在Busboy.emit(events.js:182:7)

HTML

<div class="button btn btn-danger" ngf-select ng-model="files" name="files" ngf-multiple="true">Select</div>

提交

APP.JS

if($scope.files){
    console.log('upload multiple works');
    console.log($scope.files);
    $scope.uploadFiles($scope.files);
  }
};

//FOR MULTIPLE FILES
$scope.uploadFiles = function (files) {
  if (files && files.length) {
    for (var i = 0; i < files.length; i++) {
      Upload.upload({
        url: 'api/admin/photos',
        data: {file: files[i]}
      }).then(function(resp){
        console.log('Successfully ' + resp.config.data.file.name);
        $scope.myPic = resp.config.data.file.name;
      },
      function(resp){
        console.log('Error status: ' + resp.status);
      },
      function(evt){
        var progressPercentage = parseInt(100.0 * evt.loaded / evt.total);
         console.log('progress: ' + progressPercentage + '% ' + evt.config.data.file.name);
      })
      }
    }

  };

NODE JS

   var storage = multer.diskStorage({
  destination: function (req, file, cb) {
    cb(null, 'public/img')
  },
  filename: function (req, file, cb) {
    //cb(null, file.originalname + '-' + Date.now())
    cb(null, file.originalname )
  }
});

var upload = multer({ storage: storage });

apiRoutes.post('/admin/photos',upload.array('files'),function(req,res){

//save to database
var photo = new Photos({
    url: req.file.originalname,
    name: req.file.filename
});

photo.save(function(err,docs){
    if(err) throw err;

});


console.log(req.files);
console.log(req.file.originalname);
//console.log(req.file.originalname);
res.json(req.files);

});

最后,当我使用app.use进行错误检查时,我收到以下节点错误

{ [Error: Unexpected field]


code: 'LIMIT_UNEXPECTED_FILE',
  field: 'file[0]',
  storageErrors: [] }

3 个答案:

答案 0 :(得分:0)

如果您上传多个文件并使用upload.array('files'),那么您上传的文件在req.files中可用,这是一个文件数组。

编辑:如何更改代码的简单示例:

apiRoutes.post('/admin/photos',upload.array('files'),function(req,res){
    req.files.forEach(function(file) {
      //and here you have file.originalname and file.filename
    });
});

EDIT1:

来自APP.JS的

在一个请求中发送文件:

//FOR MULTIPLE FILES
$scope.uploadFiles = function (files) {
      Upload.upload({
        url: 'api/admin/photos',
        data: {file: files}
      });
  };

答案 1 :(得分:0)

我不得不改变

data: {file: files}

to

data: {file: files[i}

这解决了它。

答案 2 :(得分:0)

以角度

更改上传脚本

您应发送单独的图片对象您的对象名称必须在nodejs和angular js中匹配

使用以下代码

Upload.upload({
    url: 'api/admin/photos',
    data: somedata,
    file_name: file_name
  })

对于多个文件

Upload.upload({
        url: 'api/admin/photos',
        data: somedata,
        files: files
      })