使用 multer 上传文件,错误:意外字段
file upload with multer, Error: Unexpected field
我正在使用 multer 从表单上传图像。 但是上传图像后,我收到意外字段错误。 在我的 HTML 中,我已将文件和文件模型名称作为 myFile。
应用.js
var express = require('express');
var bodyParser = require('body-parser');
var bodyParser = require('body-parser');
var multer = require('multer');
http = require("http"),
fs = require('fs'),
cors = require('cors');
process.on('uncaughtException', function(err) {
console.log('Caught exception: ' + err);
});
var app = express();
app.use(bodyParser.json());
app.use(bodyParser.urlencoded({extended: true}));
// cross origin:
app.all('*', function(req, res, next) {
res.header('Access-Control-Allow-Origin', '*');
res.header('Access-Control-Allow-Methods', 'PUT, GET, POST, DELETE, OPTIONS');
res.header('Access-Control-Allow-Headers', 'Content-Type');
next();
});
// end of cross
var config = require("./app/config.js")();
//Folder config.
app.use(express.static(__dirname + '/app/public/'));
app.use(express.static(__dirname + '/app/public/app/'));
app.get('/', function(req, res) {
res.sendfile('index.html');
});
var upload = multer({ dest: 'uploads/' })
app.post('/upload',upload.single('myFile'), function(req,res){
console.log(req.files);
})
http.createServer(app).listen(config.port, function() {
console.log("WDC server listening on port " + config.port + " in " + config.mode + " mode");
console.log("http://localhost:" + config.port);
});
命令
angular.module('myApp').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]);
});
});
}
};
}]);
服务
angular.module('myApp').service('fileUpload', ['$http', function ($http) {
this.uploadFileToUrl = function(file, uploadUrl){
var fd = new FormData();
fd.append('file', file);
$http.post(uploadUrl, fd, {
transformRequest: angular.identity,
headers: {'Content-Type': undefined}
})
.success(function(){
})
.error(function(){
});
}
}]);
控制器
angular.module('myApp')
.controller('ContactCtrl',['$scope', 'fileUpload', '$http', '$mdToast', '$animate',
function($scope, fileUpload, $http, $mdToast, $animate){
$scope.toastPosition = {
bottom: true,
top: false,
left: false,
right: true
};
$scope.getToastPosition = function() {
return Object.keys($scope.toastPosition)
.filter(function(pos) { return $scope.toastPosition[pos]; })
.join(' ');
};
$scope.uploadFile = function(){
var file = $scope.myFile;
console.log('file is ' );
console.dir(file);
if( typeof file === 'undefined' || file === null ){
$mdToast.show(
$mdToast.simple()
.textContent('file not found')
.position($scope.getToastPosition())
.hideDelay(5000)
);
}
else{
$mdToast.show(
$mdToast.simple()
.textContent('file uploaded Sucessfully')
.position($scope.getToastPosition())
.hideDelay(5000)
);
}
var uploadUrl = '/upload';
fileUpload.uploadFileToUrl(file, uploadUrl);
};
在客户端,您要提交一个名为 file
的文件字段,但在服务器上,您需要一个名为 myFile
的文件字段。更改一个或另一个,它应该有效。
相关文章:
- 铬:“;未捕获的语法错误:意外的标记:"
- Javascript未捕获语法错误意外的标识符错误
- 未捕获的语法错误:意外的标记{
- "未捕获的语法错误:意外的标记}"
- eslint:“;分析错误:意外的“”标记;
- 未捕获的语法错误:意外的令牌,
- "未捕获的语法错误:意外的标记"角度JS
- "未捕获的语法错误:意外的标记<"当尝试使用谷歌'核心报告API
- NodeJS用Multer上传图片;错误:意外字段“”;
- 在一个函数中,我有一个未捕获的语法错误:意外的标记else
- data.php:1未捕获的语法错误:意外的令牌:
- 未捕获的语法错误:意外的令牌非法?看起来不错
- 未捕获的语法错误:意外的标记<在yii
- AngularJS $http GET 请求到本地 JSON 文件返回语法错误:意外令牌]
- 未捕获的语法错误:意外的令牌 = (Chrome)
- Sencha 2.0 和 Codeigniter RESTful API 生成未捕获的语法错误:意外令牌:
- “语法错误:意外的令牌)”在 javascript 调用中,当 eval(value) 为空时
- HTML 无法识别我要求它运行的 javascript 文件,语法错误:意外的令牌“<”(匿名函数)script.js:
- 未捕获的语法错误:意外的令牌 if
- 使用 JSON.parse 将字符串(变量)转换为对象,错误意外标记