Express.js के लिए XMLHttpRequest के साथ कई फ़ाइलें अपलोड करें 3.5 सर्वर

Question

मैं जावास्क्रिप्ट में मूल फ़ाइलएपीआई के साथ एक फ़ाइल अपलोडर बनाने की कोशिश कर रहा हूं और मैं XMLHttpRequest (jQuery के बिना) फ़ाइलों को एक नोड.जेएस सर्वर पर अपलोड करना चाहता हूं, जो कि Express.js का उपयोग करता है।

फ़ाइल पढ़ने का हिस्सा ठीक काम करता है और जब मैं XMLHttpRequest के बिना फ़ाइल अपलोड करता हूं तो यह पूरी तरह से काम करता है (फ़ाइलें req.files Express.js में हैं)।

समस्या AJAX के माध्यम से अपलोड है: req.files हमेशा खाली होता है।

: -

Heres कुछ कोड:

रूप

<form action="http://localhost:3000/upload" method="POST" enctype="multipart/form-data" name="form"> 
    <input type="file" name="uploads" id="files" multiple="multiple"> 
    <input type="submit" name="submit" value="submit"> 
</form> 

दृश्यपटल में अपलोड हिस्सा (नहीं एक सरणी या कुछ फाइलों में [0] .data एक फाइल है)

function uploadFiles(files) { 
    var xhr = new XMLHttpRequest(); 
    xhr.submittedData = files; // Array of objects with files included. But it neither works with an array of files nor just one file 
    xhr.onload = successfullyUploaded; 
    xhr.open("POST", "http://localhost:3000/upload", true); 
    xhr.setRequestHeader('X-Requested-With','XMLHttpRequest'); 
    xhr.send(); 
} 

बैकएंड जहां समस्या होती है:

exports.receiveUpload = function(req, res){ 
    console.log(req.files); // empty 
    var files = req.files.uploads; // always empty with AJAX upload. with normal upload it's fine 
    console.log(req.xhr); // true 
    // ... 
} 

और यहाँ कुछ Express.js config है (मैं पहले से ही AJAX के बिना एक ही त्रुटि थी - कोड आप लाइनों और स्टैक ओवरफ़्लो पोस्ट कि AJAX के बिना अपलोड करने के लिए इसे हल देख सकते में टिप्पणी में):

// all environments 
app.set('port', process.env.PORT || 3000); 
app.set('views', path.join(__dirname, 'views')); 
app.set('view engine', 'ejs'); 
app.use(express.favicon()); 
app.use(express.logger('dev')); 
app.use(express.json()); 
app.use(express.urlencoded()); 

// this 3 lines have to be before app.use(app.router) 
// https://stackoverflow.com/questions/21877098/upload-file-using-express-failed-cannot-read-property-of-undefined 
app.use(express.multipart()); 
app.use(express.bodyParser({ keepExtensions: true, uploadDir: path.join(__dirname, 'public', 'uploads') })); 
app.use(express.methodOverride()); 


app.use(app.router); 
app.use(require('less-middleware')(path.join(__dirname, '/public'))); 
app.use(express.static(path.join(__dirname, 'public'))); 

अग्रिम धन्यवाद!

सादर,

सी

Answer 1

मैं इसे हल करने के लिए @Pengtuzi Thx:

मैं फ़ाइलों को अपलोड करने FormData एपीआई का इस्तेमाल किया। मेरी गलती यह थी कि मैंने सोचा कि सर्वर पर त्रुटि होगी।

यहाँ कोड है कि यह मेरे लिए हल है:

function uploadFiles(files) { 
    var xhr = new XMLHttpRequest(); 
    var formData = new FormData(); 
    xhr.onload = successfullyUploaded; 
    xhr.open("POST", "http://localhost:3000/upload", true); 
    xhr.setRequestHeader('X-Requested-With','XMLHttpRequest'); 
    for(var file in files) { 
     formData.append("uploads", files[file].data); 
    } 
    xhr.send(formData); 
}