javascript - 使用angular-file-upload的时候，后台获取不到文件和数据信息
本文介绍了javascript - 使用angular-file-upload的时候，后台获取不到文件和数据信息的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！
问题描述
问 题
目前项目中需要用到上传图片，工程师用angular写的网站，在上传图片用的是angular-file-upload插件。服务是用node写的，就是在点击上传的时候，后台总是获取不到任何的信息。上传图片到服务器这中间大概是有一个js里写代码去做一些判断或者处理的，今天谷歌了一天也没找到什么有用的信息，下面我贴一下简单的代码：
html:
<div class="wi-view-row-right">
<div class="wi-view-row-label-norm">放款凭证 :</div>
<div class="wi-view-row-content-norm">
<input type="text" class="wi-view-row-filename" readonly="readonly" ng-model="fileItem.name" />
</div>
<a href="javascript:;" class="wi-view-row-filelink">
<input type="file" accept="image/bmp, image/png, image/tiff, image/gif, image/jpeg" name="certificate" nv-file-select uploader="uploader" ng-click="clearItems()"/>浏览
</a>
</div>js:
/* upload start */
$scope.uploadStatus = false; //定义上传后返回的状态，成功获失败
var uploader = $scope.uploader = new FileUploader({
url: '/api/asset/billUpload',
method: 'POST',
queueLimit: 1, //文件个数
removeAfterUpload: true, //上传后删除文件
formData:[
{
loginId: "123"
}
]
});
$scope.clearItems = function(){ //重新选择文件时，清空队列，达到覆盖文件的效果
uploader.clearQueue();
console.log("clear");
};
uploader.onAfterAddingFile = function(fileItem) {
$scope.fileItem = fileItem._file; //添加文件之后，把文件信息赋给scope
//能够在这里判断添加的文件名后缀和文件大小是否满足需求。
console.log("onAfterAddingFile");
};
uploader.onSuccessItem = function(fileItem, response, status, headers) {
$scope.uploadStatus = true; //上传成功则把状态改为true
console.log("onSuccessItem");
};
uploader.onCompleteItem = function(fileItem, response, status, headers) {
console.log("onCompleteItem");
};
uploader.onErrorItem = function(fileItem, response, status, headers) {
console.log("onErrorItem");
};
//确认方法中需要uploader.uploadAll();//上传图片
/* upload end */
//确认成功
$scope.intendSuccess = function () {
//发送确认成功的请求
uploader.uploadAll();//上传图片
});
};这里面有传数据loginID,想在服务端打印日志的时候获取到的，但是文件什么的一样都获取不到。
node端代码不怎么会写，想知道大家都是怎么写node端代码来获取到文件是否上传成功。
这个是之前别的工程里面用到的uploadUtils.js代码
var fs = require("fs");
var config = require('./config');
var path = require("path");
var imageHandler = require("./imageCheck/imageCheck");
/**
* Create file upload
*/
exports.create = function (req, res, next) {
console.log("开始进入方法");
console.log(req);
var ticketNo = req.body.ticketNo;
var outletsCode = req.body.outletsCode;
var date = req.body.date;
var isPositive = req.body.isPositive;
var dir = config.tmp;
console.log("-------------dir-----------"+dir);
var tem_path = req.files.file.path;
console.log("第二步了");
//if (isPositive == 'yes') {
console.log('-------------------check bill start----------------');
imageHandler.checkImage(tem_path,function(err , code){
console.log('image check result:'+code);
if(err){
return res.json({
retCode: '1000040',
retMsg: 'check failed'
});
}
if(code <= 11)
{
console.log('----------------------:' + dir);
fs.exists(path.join(dir, outletsCode), function (exists) {
console.log(exists ? "outletsCode dir has already created" : "outletsCode dir is not exist !");
if (exists) {
fs.mkdir(path.join(dir, outletsCode, ticketNo + '_' + date), function (err) {
if (err) {
return res.json({
retCode: '1000020',
retMsg: 'mkdir failed'
});
} else {
console.log('mkdir succeed');
moveFile(isPositive);
}
})
} else {
fs.mkdir(path.join(dir, outletsCode), function (err) {
if (err) {
return res.json({
retCode: '1000020',
retMsg: 'mkdir failed'
});
} else {
fs.mkdir(path.join(dir, outletsCode, ticketNo + '_' + date), function (err) {
if (err) {
return res.json({
retCode: '1000020',
retMsg: 'mkdir failed'
});
} else {
console.log('mkdir succeed');
moveFile(isPositive);
}
})
}
})
}
});
}
if(code > 11)
{
fs.unlink(tem_path, function(err) {
if (err) throw err;
});
return res.json({
retCode: '1000030',
retMsg: ' Picture is not legitimate '
});
}
});
//} else {
//
// moveFile(isPositive);
//}
function moveFile(isPositive) {
console.log("123321");
var oldPath = req.files.file.path;
var name1 = req.files.file.name;
var arr = name1.split(".");
var type = arr[arr.length-1];
if (isPositive == 'yes') {
var newPath = path.join(dir, outletsCode, ticketNo + '_' + date, ticketNo+'_F_0.'+type);
} else {
var itemIndex = req.body.itemIndex;
var newPath = path.join(dir, outletsCode, ticketNo + '_' + date, ticketNo+'_B_'+itemIndex+'.'+type);
}
fs.rename(oldPath, newPath, function (data) {
if (data) {
console.log('file upload failed')
console.log(data);
return res.json({
retCode: '1000010',
retMsg: 'upload failed',
siteFilePath: newPath
});
}
else {
return res.json({
retCode: '000000',
retMsg: 'succeed',
siteFilePath: newPath
});
}
})
}
};下面是涉及到的一个imageCheck.js的代码
var child_process = require('child_process');
var path = require('path');
var exec = child_process.exec;
var basePath = path.join(__dirname, 'testImage.jar');
var imageChecker = {};
imageChecker.checkImage = function (image, done) {
console.log("imageChecker.checkImage");
last = exec('java -jar ' + basePath + ' ' + image);
var result = '', err = '';
last.stdout.on('data', function (data) {
//console.log('标准输出：' + data);
result += data;
});
// 捕获标准错误输出并将其打印到控制台
last.stderr.on('data', function (data) {
//console.log('标准错误输出：\n' + data);
err += data;
});
last.on('exit', function (code) {
//console.log('子进程已关闭，代码：' + code);
done(err, result);
});
};
module.exports = imageChecker;还有路由代码
//TODO
router.use('/billUpload', function (req, res, next) {
uploadUtil.create(req,res, function (err, data) {
console.log("------------------------------");
console.log(4343424324343);
console.log("------------------------------");
//console.log(res);
if(err){
res.sendStatus(500);
}
})
});到最后打印日志的时候，会发现console的很多东西都打不出来，可能问题说的有点乱，因为我对这一块了解的也是很浅显，希望有懂得人能帮忙指导下。主要的还是node服务这块的代码怎么写。
解决方案
这个问题目前还没人来回答，我就自问自答一下吧，imageCheck.js中缺少引入fs，var fs = require("fs");所以才会出现这样的问题，但是后来发现项目中并不需要用到checkimage，所以直接吧imagecheck拿掉了，然后在uploadUtil.js中代码修改了下，把用imagecheck验证的直接拿掉了。创建目录存图片什么的，就直接修改成下面这样了。希望对看到这个问题的人有点用处吧。
var fs = require("fs");
var config = require('./config');
var path = require("path");
/**
* Create file upload
*/
exports.create = function (req, res, next) {
var outletsCode = req.body.outletsCode;
var repayNono = req.body.repayNono;
var billType = req.body.billType;
var isPositive = req.body.isPositive;
var dir = config.tmp;
var tem_path = req.files.file.path;
if (isPositive == 'yes') {
console.log('-------------------check bill start----------------');
if(repayNono){
fs.exists(path.join(dir, outletsCode), function (exists) {
if(exists){
fs.exists(path.join(dir, outletsCode,repayNono), function (exists1) {
if(exists1){
fs.exists(path.join(dir, outletsCode,repayNono,billType), function (exists2) {
if(exists2){
console.log(err);
return res.json({
retCode: '1000020',
retMsg: 'mkdir failed'
});
}else {
fs.mkdir(path.join(dir, outletsCode, repayNono,billType), function (err) {
if (err) {
console.log(err);
return res.json({
retCode: '1000020',
retMsg: 'mkdir failed'
});
}
else {
console.log('mkdir succeed');
moveFile(isPositive);
}
})
}
})
}else {
fs.mkdir(path.join(dir, outletsCode, repayNono), function (err) {
if (err) {
console.log(err);
return res.json({
retCode: '1000020',
retMsg: 'mkdir failed'
});
}
else {
fs.mkdir(path.join(dir, outletsCode, repayNono,billType), function (err) {
if (err) {
console.log(err);
return res.json({
retCode: '1000020',
retMsg: 'mkdir failed'
});
}
else {
console.log('mkdir succeed');
moveFile(isPositive);
}
})
}
})
}
})
}else {
fs.mkdir(path.join(dir, outletsCode), function (err) {
if (err) {
console.log(err);
return res.json({
retCode: '1000020',
retMsg: 'mkdir failed'
});
}
else {
fs.mkdir(path.join(dir, outletsCode, repayNono), function (err) {
if (err) {
console.log(err);
return res.json({
retCode: '1000020',
retMsg: 'mkdir failed'
});
}
else {
fs.mkdir(path.join(dir, outletsCode, repayNono,billType), function (err) {
if (err) {
console.log(err);
return res.json({
retCode: '1000020',
retMsg: 'mkdir failed'
});
}
else {
console.log('mkdir succeed 12');
moveFile(isPositive);
}
})
}
})
}
})
}
})
}else {
fs.exists(path.join(dir, outletsCode), function (exists) {
if(exists){
fs.mkdir(path.join(dir, outletsCode, billType), function (err) {
if (err) {
return res.json({
retCode: '1000020',
retMsg: 'mkdir failed'
});
} else {
console.log('mkdir succeed');
moveFile(isPositive);
}
})
}else {
fs.mkdir(path.join(dir, outletsCode), function (err) {
if (err) {
return res.json({
retCode: '1000020',
retMsg: 'mkdir failed'
});
} else {
fs.mkdir(path.join(dir, outletsCode, billType), function (err) {
if (err) {
return res.json({
retCode: '1000020',
retMsg: 'mkdir failed'
});
} else {
console.log('mkdir succeed');
moveFile(isPositive);
}
})
}
})
}
});
}
} else {
moveFile(isPositive);
}
function moveFile(isPositive) {
var oldPath = req.files.file.path;
var name1 = req.files.file.name;
var arr = name1.split(".");
var type = arr[arr.length-1];
if (isPositive == 'yes') {
if(repayNono){
var newPath = path.join(dir, outletsCode,repayNono,billType, outletsCode+'_F_0.'+type);
}else {
var newPath = path.join(dir, outletsCode,billType, outletsCode+'_F_0.'+type);
}
} else {
var itemIndex = req.body.itemIndex;
if(repayNono){
var newPath = path.join(dir, outletsCode,repayNono,billType, outletsCode+'_B_'+itemIndex+'.'+type);
}else {
var newPath = path.join(dir, outletsCode,billType, outletsCode+'_B_'+itemIndex+'.'+type);
}
}
fs.rename(oldPath, newPath, function (data) {
if (data) {
console.log('file upload failed');
console.log(data);
return res.json({
retCode: '1000010',
retMsg: 'upload failed',
siteFilePath: newPath
});
}
else {
return res.json({
retCode: '000000',
retMsg: 'succeed',
siteFilePath: newPath
});
}
})
}
};这篇关于javascript - 使用angular-file-upload的时候，后台获取不到文件和数据信息的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
查看全文
