jquery AJAX发布formdata到节点，结果为空req.body

我试图发布数据到我的节点服务器。数据都聚集在下面的HTMLjquery AJAX发布formdata到节点，结果为空req.body

<label for="files" class="col-md-4 control-label">Files</label> 
<div class="col-md-7"> 
    <input type="file" id="files" name="files[]" multiple="multiple"> 
</div> 
<label for="name" class="col-md-4 control-label">Name</label> 
<div class="col-md-7"> 
    <input id="name" name="name" class="form-control" type="text"> 
</div> 
<label for="url" class="col-md-4 control-label">Landing Page</label> 
<div class="col-md-7"> 
    <input id="url" name="name" class="form-control" type="text"> 
</div> 
<button type="button" id="add_files" class="btn btn-primary" style="background-color:#27AE60;">Add Files</button>

click事件被抓的jQuery，并发出了ajax后

$('#add_files').on('click', function() { 
    var files = $("#files")[0].files; 
    var name = $("#name").val(); 
    var url = $("#url").val(); 
    var formData = new FormData(); 
    formData.append("name", name); 
    formData.append("url", url); 
    $.each($('#files')[0].files, function (i, file) { 
     formData.append('file-' + i, file); 
    }); 
    $.ajax({ 
     url: '/newData', 
     type: 'POST', 
     data: formData, // The form with the file inputs. 
     processData: false, // Using FormData, no need to process data. 
     contentType: false 
    }).done(function() { 
     console.log("Success: Files sent!"); 
    }).fail(function() { 
     console.log("An error occurred, the files couldn't be sent!"); 
    }); 
});

然后后由我的节点服务器，但req.boy抓是空的

app.post('/newData',function(req,res){ 
    console.log("req body ",req.body) 
    console.log("req body ",req.body.data) 
})

所得以下：

req body {} 
req body undefined

有什么想法出了什么问题？

我的实现是基于以下几点： https://developer.mozilla.org/en-US/docs/Web/API/FormData/Using_FormData_Objects How can I upload files asynchronously?

来源

2015-08-13 cs04iz1

'数据：{体：FORMDATA}'...？ – davidkonrad

@ davidkonrad，这似乎不是问题。我认为数据没有指定就转到req.body。 – cs04iz1

如果您使用['body-parser']（https://www.npmjs.com/package/body-parser）：该模块不处理您正在使用的'multipart/form-data'。你需要像['multer']（https://www.npmjs.com/package/multer）。 – robertklep

正如robertklep所提到的，问题是body-parser无法解析多部分数据。所以应该使用不同的解析。我用打杂，做连接如下：

 var fstream; 
     var result = []; 
     var number_of_files = 1; 
     req.pipe(req.busboy); 
     req.busboy.on('field', function(fieldname, val) { 
      field_obj = {} 
      field_obj[fieldname] = val; 
      result.push(field_obj); 
      console.log(field_obj) 
     }); 
     req.busboy.on('file', function(fieldname, file, filename) { 
      console.log("Uploading: " + filename); 
      //Path where image will be uploaded 
      if (result.length > 0) { 
       var file_type = filename.substr(filename.length - 4); 
       filename = result[0].name + '_' + number_of_files + file_type; 
       number_of_files++; 
      } 
      fstream = fs.createWriteStream(__dirname + "/" + filename); 
      file.pipe(fstream); 
      fstream.on('close', function() { 
       console.log("Upload Finished of " + filename); 
       result.push(filename); 
      }); 
     });

另一个解析器可以使用。

来源

2015-08-14 11:27:30 cs04iz1

有更简单的方法来完成这件事，你是手动尝试，相反，我会建议使用一个模块来处理表格和文件上传没有太多的努力，我可以推荐Formidable

来源

2015-08-13 15:02:27 edsadr

使用bodyparser e.g

var bodyParser = require('body-parser'); 
app.use(bodyParser.json()); 
app.use(bodyParser.urlencoded({ 
    extended : true 

}));

和代替

req.body

使用

req.body.name or 
req.body.url

来源

2016-10-21 07:27:53 Sunita

jquery AJAX发布formdata到节点，结果为空req.body

回答

相关问题