节点js通过jquery表单数据错误发送post请求

我想通过jQuery post请求发送一个文件。 我的node.js将读取文件并将data插入到Mongodb中。

这是我的node.jsfunction：

 upload: function(req, res){ var FileName; req.file('myFile').upload(function(err,files){ var i = 1; if(err) return res.serverError(err); FileName = files[0].filename; ...... 

上面的函数工作正常，如果直接从html发送一个post请求如下：

 <form method="post" action="/indi id="indiform" enctype="multipart/form-data"> <input type="file" name="myFile" id="myIndifile"/> <input type="submit" id="indisubmitbutton" value="Submit" name="upload" class="btn btn-primary" id = "uploadFile"/> </form> 

现在我想提交来自jQuery的post请求，并将响应data为：

 var file = $("#myIndifile")[0].files[0]; $.ajax({ type: 'post', url: '/indi', async: false, data: JSON.stringify({ myFile:file }), contentType: "application/json", success: function (data) { alert(" Number of lines Read :"+data[0].lines+"\n"+"Number of records saved:"+data[1].saved); } }); 

这是抛出 Cannot read property 'filename' of undefined at FileName = files[0].filename error 。 Cannot read property 'filename' of undefined at FileName = files[0].filename error 。

如果我发送这样的请求：

 var file = $("#myIndifile")[0].files[0]; var formdata = new FormData(); formdata.append("myFile", file); $.ajax({ type: 'post', url: '/indi', data: formdata, contentType: "multipart/form-data", success: function (data) { Pace.stop; alert(" Number of lines Read :"+data[0].lines+"\n"+"Number of records saved:"+data[1].saved); } }); 

JavaScript 引发 Uncaught TypeError: Illegal invocation error 。

一切工作正常，如果我从HTML发送请求。

如何发送具有文件内容的j​​Query的post请求？

Answer 1

你的第二个代码片段的问题是你设置的内容types不正确，多边形formdata需要一个边界。 但是，当您将FormData对象传递给$ .ajax时，如果将contentType和processData设置为false，则会为您设置正确的内容types和边界。

 var file = $("#myIndifile")[0].files[0]; var formdata = new FormData(); formdata.append("myFile", file); $.ajax({ type: 'post', url: '/indi', data: formdata, contentType: false, processData: false, success: function (data) { Pace.stop; alert(" Number of lines Read :"+data[0].lines+"\n"+"Number of records saved:"+data[1].saved); } }); 

Answer 2

上面的答案为我工作，如果它没有工作，你可以尝试这个在JavaScript中的。这两个工作正常。

 var fd = new FormData; var file = document.getElementById('myIndifile').files[0]; fd.append('myFile', file); var xhr = new XMLHttpRequest(); xhr.file = file; xhr.addEventListener('progress', function(e) { var done = e.position || e.loaded, total = e.totalSize || e.total; console.log('xhr progress: ' + (Math.floor(done/total*1000)/10) + '%'); }, false); if ( xhr.upload ) { xhr.upload.onprogress = function(e) { var done = e.position || e.loaded, total = e.totalSize || e.total; console.log('xhr.upload progress: ' + done + ' / ' + total + ' = ' + (Math.floor(done/total*1000)/10) + '%'); }; } xhr.onreadystatechange = function(e) { if ( 4 == this.readyState ) { console.log(['xhr upload complete', e]); var resdata = JSON.parse(xhr.responseText); alert(" Number of lines Read :"+resdata[0].lines+"\n"+"Number of records saved:"+resdata[1].saved); } }; xhr.open('post', '/indi', true); xhr.send(fd); });