错误在使用“vaadinfile upload”（聚合物）通过nodejs与express

我正尝试使用vaadinfile upload元素上传简单文件（请参阅https://vaadin.com/elements/-/element/vaadin-upload ）

我正在使用nodejs，并在服务器端使用multer作为中间件。

nodejs的简化代码如下：

var express = require("express"); var multer = require('multer'); var app = express(); var storage = multer.diskStorage({ destination: function (req, file, callback) { callback(null, './uploads'); }, filename: function (req, file, callback) { callback(null, file.fieldname + '-' + Date.now()); } }); var upload = multer({ storage : storage}).single('userPhoto'); app.get('/',function(req,res){ res.sendFile(__dirname + "/index.html"); }); app.post('/api/photo',function(req,res){ upload(req,res,function(err) { if(err) { return res.end("Error uploading file."); } res.end("File is uploaded"); }); }); 

我试着用我的index.html中的HTML元素，这个代码的作品

 <form id = "uploadForm" enctype = "multipart/form-data" action = "/api/photo" method = "post" > <input type="file" name="userPhoto" /> <input type="submit" value="Upload Image" name="submit"> </form> 

但是我想使用vaadin上传元素。 我写了代码

 <link rel="import" href="../bower_components/vaadin-upload/vaadin-upload.html"> <vaadin-upload id="userPhoto" target="/api/photo"></vaadin-upload> 

当我使用这个，它不能按预期工作。 我能够看到vaadin元素。 但是我无法上传文件。 当我select文件时，服务器响应string“错误上传文件”。 我对聚合物和networking开发相当陌生。 有人能指点我哪里出错吗？

Answer 1

在您的后端代码中，您必须将文件参数名称从'userPhoto'更改为'file' 。

在本地HTML表单的情况下，它会在由<input type="file">的name属性声明的参数中发送一个文件。

使用Vaadin Upload元素时，文件的发送方式与HTML表单相同。 但是不是提供的name ，而是使用名为"file"的参数发送。

请注意，您有上传的id="userPhoto"属性。 这个id是一个不同的属性，不像一个name 。

不幸的是，上传请求的文件参数名称现在还不能轻松定制。 我们计划在未来添加更多的上传请求定制function。