Я использую angular и ng-file-upload на стороне клиента. Я использую node, express и multer на стороне сервера.
Когда пользователь выбирает несколько файлов, я показываю предварительный просмотр файлов вместе с текстовым полем, привязанным к модели. Цель текстовой области - предоставить пользователю возможность дать каждому загруженному файлу примечание / описание.
Когда я вызываю функцию загрузки ng-file-upload и передаю модель файлов, я вижу, что данные динамической формы, специфичные для каждого файла, присутствуют в загружаемом массиве.
На стороне сервера я использую мультер. Кажется, все работает нормально. Я могу загрузить несколько файлов, однако данные динамической формы недоступны для встроенного в multer объекта req.files, и я не знаю, где я могу получить доступ к динамическим данным.
Я просмотрел объект запроса и не смог найти искомые данные.
Как я могу добавить динамические данные в каждый файл по отдельности, передать их на сервер и получить к нему доступ?
Клиент
$scope.uploadFiles = function(files) {
console.log('files', files); //I see that this argument contains the user input as property ‘Desc’
if (files && files.length) {
Upload.upload({
url: 'api/filesinorg/upload/'+ $rootScope.currentUser.primary_org_id,
arrayKey: '', // default is '[i]'
data: {
files: files,
fileData: {
Organization_id: $rootScope.currentUser.primary_org_id,
uploadBy_id: $rootScope.currentUser._id
}
}
})
.then(function (result) {
$timeout(function () {
$scope.filesSelected = [];
$scope.uploadedFiles.push(result.data.files);
});
}, function (result) {
if (result.status > 0) {
$scope.errorMsg = result.status + ': ' + result.data;
}
}, function (evt) {
$scope.progress = Math.min(100, parseInt(100.0 * evt.loaded / evt.total));
});
}
};
Сервер
var multer = require('multer');
var uploadPath = '';
var storage = multer.diskStorage({
destination: function (req, file, cb) {
cb(null, 'uploads/'+ req.params.orgId + '/')
},
filename: function (req, file, cb) {
cb(null, file.originalname);
}
});
var upload = multer({ storage: storage });
var uploadRoot = 'uploads/';
function checkUploadPath(req, res, next) {
var orgId = req.params.orgId;
uploadPath =uploadRoot + orgId + '/';
fs.stat(uploadPath, function(err, stats) {
if(err) {
console.log('Error', err);
fs.mkdir(uploadPath, function(err) {
if(err) {
console.log('Error in folder creation');
next();
}
next();
});
}
else {
next();
}
});
}
var type = upload.array('files');
router.use('/filesinorg/upload/:orgId', checkUploadPath, type);
router.route('/filesinorg/upload/:orgId')
.post(function(req, res) {
var orgId = req.params.orgId;
var filesUploaded = req.files;
var fileData = req.body.fileData;
var isError = false;
var filesSaved = [];
filesUploaded.forEach(function(file) {
console.log('file', file);
console.log('file.Desc', file.Desc);
var newFile = new File();
newFile.fileName = file.originalname;
newFile.serverPath = file.path;
newFile.shortDesc = file.Desc.slice(0,20);
newFile.Desc = file.Desc;
newFile.upload_dt = Date.now();
newFile.uploadBy_id = fileData.uploadBy_id;
newFile.Organization_id = fileData.Organization_id;
newFile.type = file.mimetype;
file.save(function(err, savedFile) {
if (err) {
return isError = true;
}
filesSaved.push(newFile);
console.log('File Saved success fully');
});
});
if(isError) {
res.status(500).send({
success: false,
msg: 'Error Saving File',
file: null
})
} else {
res.status(200).send({
success: true,
msg: 'Saved Contact',
files: filesSaved
});
}
});