Angularjs 无法使用multer从req对象访问req.file

我正在尝试使用NodeJs脚本将文件上载到服务器。我正在尝试以下事情

HTML

<md-tab label="Upload log">
    <md-content class="md-padding" id="popupContainer" ng-cloak>
        <h4>Upload a zip file</h4>
            <form ng-submit="$event.preventDefault()">
                <md-input-container class="md-block" flex>
                    <label>Source</label>
                    <md-select name="source" ng-model="log.source" ng-click="getSources()">
                        <md-option ng-repeat="source in sourceInfo" value="{{source.sourceCode}}">{{source.sourceName}}</md-option>
                    </md-select>
                </md-input-container>
                <br>
                <md-input-container class="md-block">
                    <label>Select Batch</label>
                    <input required type="number" step="any" name="rate" ng-model="log.batch" min="1" max="100"/>
                </md-input-container>
                <md-input-container class="md-block">
                    <label>Enter your comments about the log files</label>
                    <textarea ng-readonly="false" ng-model="log.comment" md-maxlength="100" rows="3" md-select-on-focus></textarea>
                </md-input-container>
                <div ng-if="status" id="status">
                    <b layout="row" layout-align="center center" class="md-padding">{{status}}</b>
                </div>
                <input type="file" file-model="log.file" name="inputFile"/>
                <button ng-click="uploadFiles()">Upload</button>
                {{log}}
                <p> </p>
            </form>
    </md-content>
</md-tab>

控制器

logApp.controller('fileUploadCtrl', function ($rootScope, $scope, $timeout, $location, $http, config) {
    $scope.log = {};
    $scope.uploadFiles = function () {

        console.log($scope.log);

        var uploadUrl = "http://localhost:3000/testRef";

        var fd = new FormData();
        for (var key in $scope.log)
            fd.append(key, $scope.log[key]);
        for (var pair of fd.entries()) {
            console.log(pair[0] + ', ' + pair[1]);
        }
        $http.post(uploadUrl, fd, {
            transformRequest: angular.indentity,
            headers: {
                'Content-Type': undefined
            }
        })
        .success(function () {
            console.log("success!!");
        })
        .error(function () {
            console.log("error!!");
        });
    };
});

服务器端编码

var express = require('express')
var app = express()
var multer  = require('multer');
var upload = multer({ dest: './uploads' });
app.post('/testRef', upload.any("inputFile"), function(request, response) {

    console.log(request.files)
    console.log(request.body)
    response.send("Done")
});

当我试图在控制台中查看

request.files

时，它将显示空白数组，

request.body

显示为空白对象。但是，当我打印

$scope.log

时，在客户机日志中，它显示了适当的内容，当迭代FormData变量时，我看到了我发送的所需数据。另外，在html中，当我打印

{{log}}

时，文件数据没有填充

欢迎任何类型的帮助

---

谢谢。

给表单命名并访问请求文件（“文件名”）

您必须添加标题

“内容类型”：“多部分/表单数据”

---

使用

req.files[0]

因为您的服务器代码中有

upload.any（'inputFile'）

。

我也遇到过同样的问题，但这就是我们的浏览器的工作方式，无法在multer中修复

解决方法是在客户端使用javascript捕获submit事件，改为使用FormData提交并对字段进行排序，以便输入数据位于任何文件之前

---

这个技巧对我很有效

@kumbhaniBhavesh:我得到的

req.body

是一个空对象。因此，尝试

req.body.file

可能没有帮助。它说，req.file不是一个函数。您是否为表单命名并访问了request.file（“fileName”）

是我的新表单，服务器代码是

console.log（request.file（“logInputForm”）

只需使用logInputForm尝试一次，您能否准确地告诉我应该尝试什么。因为我有点糊涂了。

var express = require('express')
var app = express()
var multer  = require('multer');
var upload = multer({ dest: './uploads' });
app.post('/testRef', upload.any("inputFile"), function(request, response) {

    console.log(request.files)
    console.log(request.body)
    response.send("Done")
});