聚合物:向NodeJS后端发出JSON-ajax请求



我正在尝试使用NodeJS作为Polymer前端的后端api进行测试。在聚合物方面,我有一个铁ajax元素:

<iron-ajax 
id='test-req' 
url='http://localhost:9090/backend-test' 
handle-as='text' 
on-response='testRsp'
body='{"data":"stuff"}'>
</iron-ajax>

testRsp处理程序只是将响应文本记录到控制台。在后端,这是我的路线:

app.get('/backend-test', function(req, res){
res.send(req.body)
console.log(req.body)
}

正如您所看到的,它所做的只是用原始请求进行响应,并在后端记录请求。正如预期的那样,双方都有相同的结果,但不幸的是,结果只是{}

现在,我还尝试通过params属性而不是iron-ajax元素的body属性发送json,在后端我使用了不推荐使用的req.param()函数,比如:req.param('data'),它在浏览器和后端都正确地打印出stuff。然而,由于它已被弃用,我正试图避免使用这种方法。

有什么建议吗?

编辑:我认为这条额外的信息会有所帮助。当我在"params"中传递json时,在后台记录req.originalUrl时,我得到/backend-test?data=stuff。当传入"body"时,它只是/backend-test

我还想指出,我也尝试过bodyParser中间件的变体:

->app.use(bodyParser.json())(结果如上所述)

->app.use(bodyParser.text())(相同)

->根本不使用bodyParser(根据express文档按预期打印undefined)

->app.use(bodyParser.text()); app.use(bodyParser.urlencoded({ extended: true }));(输出与json()和text()相同;取自req.body文档)。

第2版谢谢美联社。我一直把use语句放在任何路由定义之前,比如:

// Create Express object, enable CORS
var app = express()
app.use(bodyParser.json())
app.use(cors())
// Route definitions
app.post('/backend_test', function(req, res){
res.json(req.body)
console.log(req.body)
})
app.listen(9090, function() {
console.log('App started, listening on port 9090')
})

我还更新了iron-ajax元素,以显式生成post而不是get,并将内容类型设置为json,但不设置为dice。我仍然只能从另一边得到{}

<iron-ajax 
id='test-req' 
url='http://localhost:9090/backend_test' 
content-type="json"
method="post"
handle-as='json' 
on-response='testRsp'
body='{"data":"stuff"}'>
</iron-ajax>

Edit3我发现更新有错误,内容类型需要是application/json,而不仅仅是json。这最终使它发挥了作用。谢谢

您的中间件应该在路由之前进行初始化,并且应该类似于以下内容:

app.use(logger('dev'));
app.use(bodyParser.json());
app.use(bodyParser.urlencoded({ extended: false }));
app.use(cookieParser());
app.use(express.static(path.join(__dirname, 'public')));

就聚合物实现而言,如果您发送JSON数据,根据文档,您的元素还应包含:

<iron-ajax content-type='json'>

还有一个演示存储库,展示了一个在前端运行聚合物的示例MEAN堆栈服务器。我认为这也与你的问题有关?

PS。Youtube Black就是一个更全面的例子。

编辑:

我刚刚意识到您的聚合物元素缺少method属性。否则,您将发送GET请求!除了你的其他道具外,一定要这样使用你的元素:

<iron-ajax content-type='json' method='post'>

最新更新