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

Question

我正在学习 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)

Answer 1

来自文档

.single(fieldname)
Accept a single file with the name fieldname. The single file will be stored in req.file.

把req.files.file改成req.file，就可以了。 file 不是字段名称，而是用于单个上传而不是 files。

Answer 2

Lorenz Meyer 回答的是 correct.I 正在使其更 clear.Remove 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)
})

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

Node Js - Internal Server Error while uploading file using HTML as UI

javascript

node.js

express

multer

body-parser