Multer：req.file 未定义/空答案

【问题标题】：Multer: req.file undefined/emptyMulter：req.file 未定义/空
【发布时间】：2016-06-28 18:19:59
【问题描述】：

我正在尝试在 Mean Stack 上使用 multer 上传图像（表单的一部分）。但是，所有其他数据属性都在发布，但在图像方面我变得不确定。

html

<div class="form-group">
                    <label for="inputEmail1"  class="col-md-2 control-label">Club Logo</label>
                    <div class="col-md-4">
                      <input type="file" id="photo" name="photo" file-model="clubData.file">
                    </div>
               </div>

routes.js

'use strict';


var joinClubTeam = require('../controllers/joinClubTeam.server.controller');
var createClub = require('../controllers/createClub.server.controller');
 // var bodyParser = require('body-parser');

var multer = require('multer');
var upload =  multer({
    dest    : './uploads/',
    onError : function(err, next) {
      console.log('error', err);
      next(err);
    }
  });


module.exports = function (app) {
///////////////////////////////////////////////////////////////////////////////
  /////////////////
  // custom methods
  /////////////////
  app.route('/api/join-club-team')
    .post(joinClubTeam.JoinClubTeam);
///////////////////////////////////////////////////////////////////////////////


app.route('/api/upload', upload.single('photo')).post(createClub.TestFormData);

// 

};

服务器 Controller.js

use strict';
	/**
	 * Module dependencies
	 */
var path = require('path'),
	mongoose = require('mongoose'),
	Club = mongoose.model('Club'),
	User = mongoose.model('User'),
	Player = mongoose.model('Player'),
	Team = mongoose.model('Team'),
	multer = require('multer'),
	errorHandler = require(path.resolve('./modules/core/server/controllers/errors.server.controller'));
// var upload = multer({dest: './uploads/'});


	exports.TestFormData = function(req, res,next){
		console.log('reaching here');
	console.log(req.body);
	console.log(req.file);
	res.json({success: true});
};

客户端 Controller.js

'use strict';


angular.module('joinClubTeam').controller('createClubController', ['$scope','$state', '$http', 'Authentication', '$location', 'multipartForm', function($scope, $state, $http, Authentication, location, multipartForm){
	
	        $scope.authentication = Authentication;
	        $scope.clubData ={};
	

	
	$scope.LoadInitialData = function(){

		
		$http.get('api/sports').success(function(response){
			$scope.AllSports = response;
			
			console.log(response);
			$scope.selectedSportId = response[0]._id;
			
		});
		
	};

	
	$scope.submit = function(){

		console.log($scope.clubData.file.name);
		
			// var uploadUrl = '/upload';
		multipartForm.post('/api/upload', $scope.clubData);

	};
	
	
	
	
	
}




]);

使用自定义指令和服务。 *使用此 tut 遵循大多数准则 * https://uncorkedstudios.com/blog/multipartformdata-file-upload-with-angularjs

【问题讨论】：

您的enctype="multipart/form-data" 元素中是否设置了<form>？
@mscdex 是 enctype=multipart/form-data。由于还有其他表单组件，所以没有在这里发布它
@mscdex 文件也从客户端成功发布。

标签： angularjs node.js express file-upload multer

【解决方案1】：

我发现将multer 与bodyParser 一起使用会导致req.file 未定义。如果您遇到问题，请务必检查一下。

您还需要确保 name="filename" 和 upload.single(filename) 匹配。

【讨论】：