簡單的多部分文件上傳與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); 
     } 
    }); 

});