使用ng-file-upload指令将文件上载到sails.js服务器

Question

我正在尝试使用以下指令将文件上传到sails.js应用服务器： ng-file-upload

我的客户端上传已经选择的图像是这样的：

$upload.upload({
        url:'upload/item-image',
        headers:{
            'Content-Type': 'multipart/form-data'
        },
        data:{blah:'blah'},
        file: $scope.uploadFile,
        fileName:$scope.uploadFile.name
    }).success(function(data){
        console.log(data);
    }).error(function(err){
        console.log(err);
    });

我在服务器上处理上传的sails.js控制器方法如下所示：

upload: function (req, res) {
    req.file('item-image').upload(function (err, files) {
        if (err)
            return res.serverError(err);
        if(!files.length)
            return res.serverError('No files received for upload.');

        var file = files[0];
   ...
   }
...
}

但是，当服务器函数被调用且主体上存在json数据时，req.file（'无论放置在这里'）回调都找不到文件。

提前致谢。

Answer 1

req.file的参数需要是请求中Sails应该查找上载文件的字段的名称。 如果您正在使用以下内容执行简单的HTML表单：

<input type="file" name="myFileField" />

那么在您的控制器代码中，您将拥有：

req.file('myFileField').upload(...);

对于像本问题中引用的ng-file-upload小部件这样的上传小部件，有时候弄清楚该字段名称是什么有点棘手。 在这种情况下，它隐藏在使用说明中 ：

 //fileFormDataName: myFile, // or a list of names for multiple files (html5). // Default is 'file' 

因此，您可以设置fileFormDataName来更改上传字段名称，否则默认为file 。

如果您在文档中找不到字段名称或通过检查HTML，最简单的方法就是上传（即使它不成功）并使用Chrome中的开发人员工具检查网络请求：

这是从Angular文件上传演示页面。 您可以在右下角看到name="myFile" ； 这就是你要找的东西。 在这种情况下，文件字段称为myFile 。

Answer 2

一件重要的事情，如果您想使用以下方法处理后端中的多个文件：

req.file('files').upload({...});

你需要在Upload.upload({})添加arrayKey: ''参数，如下所示：

Upload.upload({
   url: 'http://localhost:1337/uploads',
   arrayKey: '',
   data: {
    files: files
   }