Javascript-Datei-Upload mit POST Nodejs

Question

Ich versuche ein Video aufzunehmen und auf den Server hochladen. Ich kann Videos erstellen, aber der Upload funktioniert nicht. Was könnte ich falsch machen? Ich habe versucht, die Datei direkt vom Server herunterzuladen (a.click()). es funktioniert, aber ich bin nicht in der Lage, auf nodejs Server

hochladen Ich bin in der Lage, Textwerte zu posten und vom Server abrufen kann ich Dateien aus dem Dateisystem mit einem Formular in HTML hochgeladen und übergeben Sie eine Datei als direkt ausgewählt ..below

<form id="uploadForm" 
     enctype="multipart/form-data" 
     action="/upload" 
     method="post"> 
    <input type="file" name="file" /> 
    <input type="submit" value="Upload Image" name="submit"> 
    <span id = "status"></span> 
</form> 

i auch in der Lage sind Dateien mit socket.io senden, wenn socket.emit ist tun ('msg', Dateien), aber ich kann Buchse nicht auf prod-Umgebung verwenden. Ich bin offen für jede andere Art und Weise aufgezeichnete Datei zu senden Server NodeJS

Server-Code

var express \t = \t require("express"); 
 
var multer \t = \t require('multer'); 
 

 
var app \t = \t express(); 
 
var fs = require('fs'); 
 
var storage \t = \t multer.diskStorage({ 
 
    destination: function (req, file, callback) { 
 
    callback(null, './uploads'); 
 
    }, 
 
    filename: function (req, file, cb) { 
 
       var datetimestamp = Date.now(); 
 
       cb(null, file.originalname + '-' + datetimestamp + '.' + file.originalname.split('.')[file.originalname.split('.').length -1]) 
 
      } 
 
    }); 
 
var upload = multer({ storage : storage}).single('file'); 
 
app.get('/',function(req,res){ 
 
     res.sendFile(__dirname + "/index.html"); 
 
}); 
 
app.post('/uploadlocal',function(req,res){ 
 

 
\t upload(req,res,function(err) {console.log(req.files); 
 
\t console.log(req.body); 
 

 
\t \t if(err) { 
 
\t \t \t return res.end("Error uploading file."); 
 
\t \t } 
 
\t 
 
\t \t res.end("File is uploaded"); 
 
\t }); 
 
}); 
 

 

 

 
app.listen(3000,function(){ 
 
    console.log("Working on port 3000"); 
 
});

-Client-Code

function download() { 
 
    var blob = new Blob(recordedBlobs, {type: 'video/webm'}); 
 
    var url = window.URL.createObjectURL(blob); 
 
     var files = { 
 

 
            video: { 
 
             type: 'video/webm', 
 
             dataURL: url 
 
            } 
 
          }; 
 
    console.log('recording done'); 
 

 
    var a = document.createElement('a'); 
 
    a.style.display = 'none'; 
 
    a.href = url; 
 
    a.download = 'test.webm'; 
 
    document.body.appendChild(a); 
 
a.click(); 
 
    postclick(files); 
 

 
    setTimeout(function() { 
 
    document.body.removeChild(a); 
 
    window.URL.revokeObjectURL(url); 
 
    }, 100); 
 
} 
 

 

 
function postclick(data) { 
 
    var form = $('<form></form>'); 
 

 
    form.attr("method", "post"); 
 
    form.attr("action", '/uploadlocal'); 
 
    var field = $('<input></input>'); 
 
    field.attr("type", "text"); 
 
\t field.attr("name", 'file'); 
 
    field.attr("value", data); 
 

 
     form.append(field); 
 
    $(document.body).append(form); 
 
    form.submit(); 
 
}

Answer 1

das Problem gelöst, indem xmlhttprequest

var formData = new FormData(); 
formData.append('file', blob, "test.webm"); 
var request = new XMLHttpRequest(); 
request.open("POST", "/upload"); 
request.send(formData);