2014-08-29 37 views
1

所以我有一个简单的JavaScript的前端:FORMDATA张贴到快速4.0 - 身体分析器不工作

var xhr = new XMLHttpRequest(); 
var data = new FormData(); 
data.append('param1', 'value1'); 
data.append('param2', 'value2'); 
xhr.open('POST', '/query'); 
xhr.onload = function(data){ 
    console.log('loaded', this.responseText); 
}; 
xhr.send(data); 

,并在节点侧:

var express = require('express'); 
var app = express(); 
app.use(bodyParser.json()); 
app.use(bodyParser.urlencoded()); 

app.post('/query', function(req, res){ 
    console.log(req.body); 
    res.send('ok'); 
}); 

当我运行它,控制台记录一个空对象{}

如果我尝试使用适当的形式,如:

<form method="POST" action="/query"> 
    <input type="text" name="param1" value="value1"> 
    <input type="text" name="param2" value="value2"> 
    <button type="submit">Submit</button> 
</form> 

一切按预期和控制台日志:

{ param1: 'value1', param2: 'value2' } 

我在做什么错?

回答

1

因为FormData对象总是作为XHR的multipart/formdata发送。 https://dvcs.w3.org/hg/xhr/raw-file/tip/Overview.html#dom-xmlhttprequest-send

您可以通过multer解析FormData。 如果不发送任何二进制文件,或者以字符串形式(json或查询字符串)而不是FormData发送。

以下代码发送json字符串,服务器可以解析数据。

var xhr = new XMLHttpRequest(); 
var data = { 
    param1: 'value1', 
    param2: 'value2' 
}; 
xhr.open('POST', '/query'); 
xhr.onload = function(data) { 
    console.log('loaded', this.responseText); 
}; 
xhr.setRequestHeader('Content-Type', 'application/json'); 
xhr.send(JSON.stringify(data));