【问题标题】:Multer 1.0.3 Mean Stack file uploadMulter 1.0.3 平均堆栈文件上传
【发布时间】:2015-10-31 08:52:19
【问题描述】:

我正在尝试为一个简单的 MEAN 堆栈应用程序上传 multipart/form-data。将所有内容放在一个文件中并运行它可以正常工作。

Server.js

var express = require('express');
var multer  = require('multer');
var storage = multer.diskStorage({
                destination: function (req, file, cb) {
                    cb(null, 'uploads/');
                },
                filename: function (req, file, cb) {
                    switch(file.mimetype) {
                    case 'image/jpg' :
                    case 'image/jpeg':
                    case 'image/gif':
                      var extension = file.mimetype.split("/");
                      extension = extension[extension.length-1];
                      break
                    case 'video/quicktime':
                      var extension = 'mov';
                      break
                    case 'video/mp4':
                      var extension = 'mp4';
                      break
                    default:
                      var extension = 'jpeg';

                   }
                      cb(null, file.fieldname + '-' + Date.now() + "." + extension);
                   }
                   });
var upload = multer({ storage: storage });
var path    = require('path');
var app = express();

var segmentUpload = upload.fields([{ name: 'segmentVideo', maxCount: 1}, { name: 'segmentStill', maxCount: 1}, { name: 'segmentGif', maxCount: 1}])
app.post('/photos/upload', segmentUpload, function (req, res, next) {
  console.log(req);
  console.log(req.files['segmentVideo'][0]);
  console.log(req.files['segmentStill'][0]);
  console.log(req.files['segmentGif'][0]);
  console.log(req.body.title);
});

app.get('/', function(req, res) {
  res.sendfile('./index.html');
});

app.listen(8080);
console.log("App listening on port 8080");

index.html

<body>
<form action="/photos/upload" method="post" enctype="multipart/form-data">
    title: <input type="text" name="title"> <br><br>
    Select video to upload:
    <input type="file" name="segmentVideo" id="fileToUpload"> <br><br>
    Select jpeg to upload:
    <input type="file" name="segmentStill" id="fileToUpload"><br><br>
    Select gif to upload:
    <input type="file" name="segmentGif" id="fileToUpload"><br><br>
    <input type="submit" value="Upload Image" name="submit">
</form>

但是当我尝试将 multer 集成到我的节点路由中时,我无法让我的应用接受 multipart/form-data。

app/routes.js

var Video   = require('./models/video');
var multer          = require('multer');
var storage         = multer.diskStorage({
                  destination: function (req, file, cb) {
                    cb(null, 'uploads/');
                  },
                  filename: function (req, file, cb) {
                    switch(file.mimetype) {
                      case 'image/jpg' :
                      case 'image/jpeg':
                      case 'image/gif':
                        var extension = file.mimetype.split("/");
                        extension = extension[extension.length-1];
                        break
                      case 'video/quicktime':
                        var extension = 'mov';
                        break
                      case 'video/mp4':
                        var extension = 'mp4';
                        break
                      default:
                        var extension = 'jpeg';

                    }
                    console.log("new extension: " + extension);
                    cb(null, file.fieldname + '-' + Date.now() + "." + extension);
                  }
                });
var upload          = multer({ storage: storage });

module.exports = function(app) {

// api --------------------------------------
// get all todos
app.get('/api/videos', function(req,res){

    // use mongoose to get all todos in the database
    Video.find(function(err, videos){

        // if there is an error, send the error
        if (err)
            res.send(err);

        res.json(videos);
    });
});

var segmentUpload = upload.fields([{ name: 'segmentVideo', maxCount: 1}, { name: 'segmentStill', maxCount: 1}, { name: 'segmentGif', maxCount: 1}])
    app.post('/api/videos', segmentUpload, function(req, res){
    // create a video
    Video.create({
        title : req.body.title,
        description : req.body.description,
        category : req.body.category,
        day : req.body.day,
        videoUrl : req.body.videoUrl,
        stillUrl : req.body.stillUrl,
        gifUrl : req.body.gifUrl,
        airReady : false
    }, function(err, video) {
        if (err)
            res.send(err)

        // get and return all the todos after you create another
        Video.find(function(err, videos){
            if (err)
                res.send(err)
            res.json(videos);
        });
    });

});

// delete a todo
app.delete('/api/videos/:video_id', function(req,res){
    Video.remove({
        _id : req.params.video_id
    }, function(err, video) {
        if (err)
            res.send(err);

        // get and return all the todos after you delete one
        Video.find(function(err, videos) {
            if (err)
                res.send(err)
            res.json(videos);
        });
    });

});

// edit a todo
app.put('/api/videos/:video_id', function(req,res){
    Video.findByIdAndUpdate(req.params.video_id, 
        { $set: { title: req.body.title
        }}, 
            function(err, video){

        if (err)
            res.send(err)

        // get and return all todos after edit
        Video.find(function(err, videos){
            if (err)
                res.send(err)
            res.json(videos);
        });
    });
});

// find -------------------------------------------------------------
app.get('*', function(req, res) {
    res.sendfile('./public/index.html'); // load the single view file (angular will handle the page changes on the front-end)
});
};

我收到一个错误:

TypeError: Cannot read property &#39;title&#39; of undefined

这是我关于堆栈溢出的第一篇文章,但我感谢所有支持!

【问题讨论】:

  • 您能否指定出现此错误的行。它有助于调试

标签: angularjs node.js multipartform-data multer


【解决方案1】:

问题可能是由于使用正在发送 multipart/form-data 但您没有将其转换为 json 并且您正在使用 json 来检索数据。

使用body-parser

var bodyParser = require('body-parser');
var app = express();
app.use(bodyParser.json());

【讨论】:

    猜你喜欢
    • 2014-05-21
    • 2015-12-23
    • 2015-04-21
    • 2020-03-30
    • 2014-02-06
    • 2020-09-09
    • 2018-11-29
    • 1970-01-01
    • 2016-09-11
    相关资源
    最近更新 更多