einfacher mehrteiliger Datei-Upload mit express.js und multer mit AJAX

Question

Ich bekomme keine Fehler. Der Ordner uploads hat chmod 777.

Backend:

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"); 
    }); 
}); 

Frontend:

$("#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); 
      } 
     }); 

    }); 

aber wurden keine Dateien hochgeladen. Ich habe auch versucht, die Datei zu bekommen und anformData vor dem Senden anhängen - gleicher Effekt.

Answer 1

für das vordere Ende, contentType muss auf false gesetzt werden, um ein Formdata-Objekt zu verwenden in jQuery.ajax, auch $(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); 
     } 
    }); 

});