Multer 1.0.3平均堆栈文件上传

时间:2015-08-07 19:59:45

标签: angularjs node.js multipartform-data multer

我正在尝试为简单的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。

应用/ 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

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

1 个答案:

答案 0 :(得分:0)

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

使用body-parser

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