将图片上传到上传文件夹_ JavaScript

Question

Users will be able to either send a text post(input type="text") or image post(input type="file"). But they won't be sending both

Here's my form (in Jade):

form#addPost(action="/uploads", method="post", placeholder='Add your ideas here...')
            input#postinput(type="text", name="contents" placeholder="Add your ideas here...")
            div.privacy(class="onoffswitch", id='privacytog')
                input(type="checkbox" name="onoffswitch" class="onoffswitch-checkbox" id="myonoffswitch" checked)
                label(class="onoffswitch-label" for="myonoffswitch")
                    span(class="onoffswitch-inner")
                    span(class="onoffswitch-switch")
            <div style="height:0px;overflow:hidden">
            <input type="file" id="fileInput"  name="fileInput" accept="image/*">
            </div>
            input#submit1(type="submit", value="Post")

And Here's my app.js(server-side code)

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

app.use(multer({
    dest: "./public/uploads/"
}));

app.post("/uploads", function(req, res) {
    var data = req.body;
    var id = req.user._id;
    var username = req.user.username;
    var date = Date();
    var onOff = false;
    if (req.body.onoffswitch) {
      onOff = true;
    }


    //Images upload to uploads folder
    if (req.files) {

      console.log(util.inspect(req.files));
      if (req.files.fileInput.size === 0) {
                  return next(new Error("Hey, first would you select a file?"));
      }
      fs.exists(req.files.fileInput.path, function(exists) {
        if(exists) {
          res.end("Got your file!");
        } else {
          res.end("Well, there is no magic for those who don’t believe in it!");
        }
    });
  }



    User.findById(id, function(err, user) {
      if (err) return handleErr(err);

      var uid = shortid.generate();

      newPost = {
        //If sending down an Image use data.fileInput not contents
        contents: [data.contents || '/img/'+data.fileInput],
        _id: uid,
        privacy: onOff,
        username: req.user.username,
        date: date,
        rating: Number(0),
        uwv: []
      };

      user.posts.push(newPost);

      user.save(function(err, user){
        if(err) return handleErr(err);
        if(newPost.privacy === 'false'){
          for (var i = 0; i < user.followers.length; i++) {
            User.findOne({username:user.followers[i]}, function(err, follower){
              follower.discover.push(newPost)
              follower.save();
            });
          }
        }
      });
    });

}

Images are being uploaded and saved to uploads folder. However when posting just a text post(only filling in input type="text") it keeps throwing back the error: Cannot read property 'size' of undefined

Answer 1

Typically browsers will not send the file field if there is no file selected, so there is no way for the backend to know that there was such a field.

Instead just check for the existence of the file field: if (!req.files.fileInput) . You may also want to check that the file is not empty: if (!req.files.fileInput || !req.files.fileInput.size)