Question

我正在构建一个REST Api，其中包含使用Express的很多图像。项目结构如下所示。

在公共文件夹中，您可以看到该结构。

我想上传图片并将其存储在img文件夹中。所以这是我的代码。

fileupload.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:3000/fileupload" method="POST" enctype="multipart/form-data">
        <input type="file" name="file" size="50" />
        <br />
        <input type="submit" value="Upload File" />
        </form>
        </body>
        </html>

和 fileupload.js

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

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

            //console.log(multer);

            app.use(express.static('public'));
            app.use(bodyParser.urlencoded({ extended: false }));
            app.use(multer({ dest: '/img'}));

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

            app.post('/fileupload', function (req, res) {

               console.log(req.files.file.name);
               console.log(req.files.file.path);
               console.log(req.files.file.type);

               var file = __dirname + "/img" + 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(3000, function () {
              var host = server.address().address
              var port = server.address().port

              console.log("Example app listening at localhost:3000/", host, port)
            })

app.js

                    var express = require('express');
                var path = require('path');
                var favicon = require('serve-favicon');
                var logger = require('morgan');
                var cookieParser = require('cookie-parser');
                var bodyParser = require('body-parser');
                var mongoose = require('mongoose');
                var url = 'mongodb://localhost:27017/larissaApp';

                mongoose.connect(url);
                var db = mongoose.connection;
                db.on('error',console.error.bind(console,'connection error:'));
                db.once('open',function(){
                   console.log("Connected correctly to server"); 
                });

                var routes = require('./routes/index');
                var users = require('./routes/users');
                var newsRouter = require('./routes/newsRouter');

                var app = express();
                // view engine setup
                app.set('views', path.join(__dirname, 'views'));
                app.set('view engine', 'jade');
                // uncomment after placing your favicon in /public
                //app.use(favicon(path.join(__dirname, 'public', 'favicon.ico')));
                app.use(logger('dev'));
                app.use( bodyParser.json({limit: '50mb'}) );
                app.use(bodyParser.urlencoded({
                  limit: '50mb',
                  extended: true,
                  parameterLimit:50000
                }));
                app.use(bodyParser.urlencoded({ extended: false }));
                app.use(cookieParser());
                app.use(express.static(path.join(__dirname, 'public')));

                app.use('/', routes);
                app.use('/users', users);
                app.use('/news',newsRouter);

                // catch 404 and forward to error handler
                app.use(function(req, res, next) {
                  var err = new Error('Not Found');
                  err.status = 404;
                  next(err);
                });
                // error handlers
                // development error handler
                // will print stacktrace
                if (app.get('env') === 'development') {
                  app.use(function(err, req, res, next) {
                    res.status(err.status || 500);
                    res.render('error', {
                      message: err.message,
                      error: err
                    });
                  });
                }
                // production error handler
                // no stacktraces leaked to user
                app.use(function(err, req, res, next) {
                  res.status(err.status || 500);
                  res.render('error', {
                    message: err.message,
                    error: {}
                  });
                });
                module.exports = app;

然而，在尝试从html页面上传图像后，我收到404错误。

                404

            Error: Not Found
                at C:\Users\Theodosios\Desktop\larissa-node\larissaApp\rest-server\app.js:40:13
                at Layer.handle [as handle_request] (C:\Users\Theodosios\Desktop\larissa-node\larissaApp\rest-server\node_modules\express\lib\router\layer.js:95:5)
                at trim_prefix (C:\Users\Theodosios\Desktop\larissa-node\larissaApp\rest-server\node_modules\express\lib\router\index.js:317:13)
                at C:\Users\Theodosios\Desktop\larissa-node\larissaApp\rest-server\node_modules\express\lib\router\index.js:284:7
                at Function.process_params (C:\Users\Theodosios\Desktop\larissa-node\larissaApp\rest-server\node_modules\express\lib\router\index.js:335:12)
                at next (C:\Users\Theodosios\Desktop\larissa-node\larissaApp\rest-server\node_modules\express\lib\router\index.js:275:10)
                at C:\Users\Theodosios\Desktop\larissa-node\larissaApp\rest-server\node_modules\express\lib\router\index.js:635:15
                at next (C:\Users\Theodosios\Desktop\larissa-node\larissaApp\rest-server\node_modules\express\lib\router\index.js:260:14)
                at Function.handle (C:\Users\Theodosios\Desktop\larissa-node\larissaApp\rest-server\node_modules\express\lib\router\index.js:174:3)
                at router (C:\Users\Theodosios\Desktop\larissa-node\larissaApp\rest-server\node_modules\express\lib\router\index.js:47:12)
                at Layer.handle [as handle_request] (C:\Users\Theodosios\Desktop\larissa-node\larissaApp\rest-server\node_modules\express\lib\router\layer.js:95:5)
                at trim_prefix (C:\Users\Theodosios\Desktop\larissa-node\larissaApp\rest-server\node_modules\express\lib\router\index.js:317:13)
                at C:\Users\Theodosios\Desktop\larissa-node\larissaApp\rest-server\node_modules\express\lib\router\index.js:284:7
                at Function.process_params (C:\Users\Theodosios\Desktop\larissa-node\larissaApp\rest-server\node_modules\express\lib\router\index.js:335:12)
                at next (C:\Users\Theodosios\Desktop\larissa-node\larissaApp\rest-server\node_modules\express\lib\router\index.js:275:10)
                at serveStatic (C:\Users\Theodosios\Desktop\larissa-node\larissaApp\rest-server\node_modules\serve-static\index.js:75:16)

我做错了什么？

谢谢，

西奥。

Answer 1

下载使用Express

上传图像的代码

File upload with express

Answer 2

试试这个。

我修改了你的js一点点，它对我有用而没有错误。

我为每一行编辑都写了评论。

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

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

//console.log(multer);

app.use(express.static('public'));
app.use(bodyParser.urlencoded({extended: false}));
var upload = multer({dest: './img'});// declare multer default path(best to use /tmp for this if on linux)

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


app.post('/fileupload', upload.single('file')/*inserted  multer middleware for one file*/, function (req, res) {
    //Declare variable to easy change
    var file = req.file;

    // this are correct names for variables of req.file
    console.log(file.filename);
    console.log(file.path);
    console.log(file.mimetype);

    // path of file stored
    var path = __dirname + '/img/';
    // variable for storing path
    var filePath = path + file.filename;
    //It's better to declare variable first then use it
    var response;
    fs.readFile(filePath, function (err, data) {
        fs.writeFile(path + file.originalname, data, function (err) {
            if (err) {
                console.log(err);
            } else {
                response = {
                    message: 'File uploaded successfully',
                    filename: file.originalname
                };
            }
            console.log(response);
            res.end(JSON.stringify(response));
        });
    });
});

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

    console.log("Example app listening at localhost:3000/", host, port)
});

使用Express上传图像

2 个答案:

下载使用Express