Question

我正在为我的前端使用angularJS，为我的后端使用sails.js / expressjs。我正在使用ng-file-upload实现文件上传功能，奇怪的是该文件似乎永远不会成功上传到服务器...这是我的angularJS代码：

$scope.$watch('data.chosenImageFile', function() {
    if ($scope.data.chosenImageFile) {
        console.log($scope.data.chosenImageFile);
        $scope.upload = $upload.upload({
            url: '/upload_user_avatar',
            method: 'POST',
            file: $scope.data.chosenImageFile
        }).progress(function(evt) {
            console.log('progress: ' + parseInt(100.0 * evt.loaded / evt.total));
        }).success(function(data, status, headers, config) {
            console.log(data);
        });
    }
});

这是我的sails.js代码：

uploadUserAvatar: function(req, res) {
    req.file('avatar').upload(function(err, files) {
        if (err) return res.send(500, err);
        return res.json({
            message: files.length + ' file(s) uploaded successfully!',
            files: files
        });
    });
},

我总是从服务器得到以下响应：

Object {message: "0 file(s) uploaded successfully!", files: Array[0]}

当我检查相应的服务器上传目标文件夹时，没有任何内容......任何人都知道为什么或可以提供一些帮助？真的很感激！

Answer 1

好的这个问题不是一个非常聪明的问题，我弄清楚问题出在哪里：ng-file-upload的默认fileFormDataName是“file”，因为我正在使用req.file（'avatar'）在服务器端，我应该在我的角度代码中添加以下设置选项：

        fileFormDataName: 'avatar',

使它看起来像这样：

$scope.$watch('data.chosenImageFile', function() {
    if ($scope.data.chosenImageFile) {
        console.log($scope.data.chosenImageFile);
        $scope.upload = $upload.upload({
            url: '/upload_user_avatar',
            method: 'POST',
            fileFormDataName: 'avatar',
            file: $scope.data.chosenImageFile
        }).progress(function(evt) {
            console.log('progress: ' + parseInt(100.0 * evt.loaded / evt.total));
        }).success(function(data, status, headers, config) {
            console.log(data);
        });
    }
});

更新

根据@Anupam Bhaskar的要求，我还在下面的文件上传dropzone中添加了我的HTML代码：

<div ng-file-drop ng-if="!data.isUploading" ng-model="data.chosenImageFile" class="avatar-dropzone pull-left" drag-over-class="upload-dropzone" ng-file-change="avatarUpload.fileSelected('/upload_user_avatar', data.user, data)" multiple="false" allow-dir="true" accept="*">
   <div class="text-center upload-sign">+</div>
</div>

角度文件上传+风帆队长上传没有文件

1 个答案:

更新