简单的多部分文件上传与express.js和mjter与ajax

Question

我没有得到任何错误。文件夹uploads有chmod 777。

后端：

var multer = require('multer'); 
var storage = multer.diskStorage({ 
    destination: function (req, file, cb) { 
     cb(null, './uploads') 
    }, 
    filename: function (req, file, cb) { 
     cb(null, file.fieldname + '-' + Date.now()) 
    } 
}); 

var upload = multer({ storage: storage, 
         limits: { fileSize: '50mb' }}).single('photo'); 


router.post('/bild',function(req,res){ 
    console.log("REQ",req); //file is there in the body 
    upload(req,res,function(err) { 
     if(err) { 
      return res.end("Error uploading file."); 
     } 
     res.end("File is uploaded"); 
    }); 
}); 

前端：

$("#formular").submit(function (e) { 
     e.preventDefault(); 
     var form = $(this)[0]; 
     var formData = new FormData(form); 
     console.log(formData) 
     $.ajax({ 
      type: "POST", 
      url: "https://stackoverflow.com/users/bild", 
      data: formData, 
      processData: false, 
      "content-type": "application/x-www-form-urlencoded", 
      success: function(r){ 
       console.log("result",r) 
      }, 
      error: function (e) { 
       console.log("some error", e); 
      } 
     }); 

    }); 

但没有文件上传。我也尝试在发送之前获取文件并将其附加到formData - 相同的效果。

Answer 1

对于前端，contentType必须设置为假以使用jQuery.ajax一个FORMDATA对象，也$(this)[0] === this

$("#formular").submit(function (e) { 
    e.preventDefault(); 
    var formData = new FormData(this); 
    console.log(formData) 
    $.ajax({ 
     type: "POST", 
     url: "https://stackoverflow.com/users/bild", 
     data: formData, 
     processData: false, 
     contentType: false, 
     success: function(r){ 
      console.log("result",r) 
     }, 
     error: function (e) { 
      console.log("some error", e); 
     } 
    }); 

});