Node Js - 使用 HTML 作为 UI 上传文件时出现内部服务器错误答案

【问题标题】：Node Js - Internal Server Error while uploading file using HTML as UINode Js - 使用 HTML 作为 UI 上传文件时出现内部服务器错误
【发布时间】：2017-07-23 03:05:14
【问题描述】：

我正在关注 NodeJs https://www.tutorialspoint.com/nodejs/nodejs_express_framework.htm 的本教程。在运行此示例时，我遇到了这个问题 Internal Server Error。

这是 HTML 代码：

<html>
   <head>
      <title>File Uploading Form</title>
   </head>

   <body>
      <h3>File Upload:</h3>
      Select a file to upload: <br />

      <form action = "http://127.0.0.1:8050/file_upload" method = "POST" 
         enctype = "multipart/form-data">
         <input type="file" name="file" size="50" />
         <br />
         <input type = "submit" value = "Upload File" />
      </form>

   </body>
</html>

这是 NodeJs 代码：-

var express = require('express');
var app = express();
var fs = require("fs");

var bodyParser = require('body-parser');
var multer  = require('multer');

app.use(express.static('public'));
app.use(bodyParser.urlencoded({ extended: false }));
app.use(multer({ dest: '/tmp/'})).single('file'));//I have added this, this is also a mistake by them (tutorialpoint.com)

app.get('/index.htm', function (req, res) {
   res.sendFile( __dirname + "/" + "index.htm" );
})

app.post('/file_upload', function (req, res) {
   console.log(req.files.file.name);
   console.log(req.files.file.path);
   console.log(req.files.file.type);
   var file = __dirname + "/" + req.files.file.name;

   fs.readFile( req.files.file.path, function (err, data) {
      fs.writeFile(file, data, function (err) {
         if( err ){
            console.log( err );
            }else{
               response = {
                  message:'File uploaded successfully',
                  filename:req.files.file.name
               };
            }
         console.log( response );
         res.end( JSON.stringify( response ) );
      });
   });
})

var server = app.listen(8050, function () {
   var host = server.address().address
   var port = server.address().port

   console.log("Example app listening at http://%s:%s", host, port)
})

这是我的日志：-

Example app listening at http://localhost:8050
TypeError: Cannot read property 'file' of undefined
    at C:\Users\devuser\Desktop\nodejsPrograms\filenew\server.js:17:25
    at Layer.handle [as handle_request] (C:\Users\devuser\node_modules\express\lib\router\layer.js:95:5)
    at next (C:\Users\devuser\node_modules\express\lib\router\route.js:131:13)
    at Route.dispatch (C:\Users\devuser\node_modules\express\lib\router\route.js:112:3)
    at Layer.handle [as handle_request] (C:\Users\devuser\node_modules\express\lib\router\layer.js:95:5)
    at C:\Users\devuser\node_modules\express\lib\router\index.js:277:22
    at Function.process_params (C:\Users\devuser\node_modules\express\lib\router\index.js:330:12)
    at next (C:\Users\devuser\node_modules\express\lib\router\index.js:271:10)
    at Immediate.<anonymous> (C:\Users\devuser\node_modules\multer\lib\make-middleware.js:53:37)
    at Immediate.immediate._onImmediate (timers.js:440:18)

【问题讨论】：

Example app listening at http://:::8050 - 这不应该是localhost:8050 吗？
这不是问题，更早的例子甚至可以使用这个 http://:::8050
console.log(req.files.file.name);的输出是什么
@Azola req.files 未定义
@mvermand 首先阅读问题和答案，然后说重复。我已经在使用multer了。你看不到代码吗？

标签： javascript node.js express multer body-parser

【解决方案1】：

Lorenz Meyer 的回答是正确的。我说得更清楚了。删除 files 属性，它必须有效。这是您更新的服务器代码：

var express = require('express');
var app = express();
var fs = require("fs");

var bodyParser = require('body-parser');
var multer  = require('multer');

app.use(express.static('public'));
app.use(bodyParser.urlencoded({ extended: false }));
app.use(multer({ dest: '/tmp/'}).single('file'));//I have added this, this is also a mistake by them (tutorialpoint.com)

app.get('/index.htm', function (req, res) {
   res.sendFile( __dirname + "/" + "index.htm" );
})

app.post('/file_upload', function (req, res) {
   console.log(req.file.name);
   console.log(req.file.path);
   console.log(req.file.type);
   var file = __dirname + "/" + req.file.name;

   fs.readFile( req.file.path, function (err, data) {
      fs.writeFile(file, data, function (err) {
         if( err ){
            console.log( err );
            }else{
               response = {
                  message:'File uploaded successfully',
                  filename:req.file.name
               };
            }
         console.log( response );
         res.end( JSON.stringify( response ) );
      });
   });
})

var server = app.listen(8050, function () {
   var host = server.address().address
   var port = server.address().port

   console.log("Example app listening at http://%s:%s", host, port)
})

【讨论】：

【解决方案2】：

来自文档

.single(fieldname)
接受名称为 fieldname 的单个文件。单个文件将存储在req.file。

将req.files.file 更改为req.file，它将起作用。 file 不是字段的名称，而是用于单次上传而不是 files。

【讨论】：

谢谢它的工作，所以filedname与这个文件无关。我的意思是 fieldname 只会被 single() 使用