2
我想上传一个文件使用脚本的NodeJS服务器访问req.files。我正在尝试以下的事情。无法从REQ对象使用multer
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>
指令
var logApp = angular.module('logAnalysisApp', ['ngMaterial', 'lfNgMdFileInput', 'ngRoute', 'ngMessages']);
logApp.config(['$routeProvider', '$compileProvider', '$mdThemingProvider', function ($routeProvider, $compileProvider, $mdThemingProvider) {
$compileProvider.debugInfoEnabled(false);
$routeProvider
.when('/login', {
templateUrl: 'views/login.html',
controller: 'loginControl'
})
.when('/register', {
templateUrl: 'views/register.html',
controller: 'registerControl'
})
.when('/home', {
templateUrl: 'views/filemenu.html',
controller: 'fileUploadCtrl'
})
.when('/admin', {
templateUrl: 'views/adminpanel.html',
controller: 'adminCtrl'
})
.when('/totalreport', {
templateUrl: 'views/total.html',
controller: 'totalCtrl'
})
.otherwise({
redirectTo: '/login'
});
}
])
logApp.constant('config', {
apiUrl: 'http://localhost:8080',
serverUrl: 'http://localhost:3000'
})
logApp.directive('fileModel', ['$parse', function ($parse) {
return {
restrict: 'A',
link: function (scope, element, attrs) {
var model = $parse(attrs.fileModel);
var modelSetter = model.assign;
element.bind('change', function() {
scope.$apply(function() {
modelSetter(scope, element[0].files[0]);
});
});
}
};
}
]);
控制器
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可变迭代我看到其中我送所需的数据时。另外，在我打印{{log}}时，html文件数据没有被填充。
任何类型的帮助是值得欢迎的。
谢谢。
@kumbhaniBhavesh：我收到'req.body'为空对象。所以，尝试'req.body.file'可能没有帮助。 –