在 Express.js 的 Post 的 req.body 中获得空响应

Question

这是我附加的两个文件。 我收到来自 req.body 的空回复，

1. 我的 index.html 文件是

 <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.5.0/css/bootstrap.min.css" integrity="sha384-9aIt2nRpC12Uk9gS9baDl411NQApFmC26EwAOH8WgZl5MYYxFfc+NcPb1dKGj7Sk" crossorigin="anonymous"> <script src="https://code.jquery.com/jquery-3.5.1.min.js" crossorigin="anonymous"></script> <script src="https://cdn.jsdelivr.net/npm/popper.js@1.16.0/dist/umd/popper.min.js" integrity="sha384-Q6E9RHvbIyZFJoft+2mJbHaEWldlvI9IOYy5n3zV9zzTtmI3UksdQRVvoxMfooAo" crossorigin="anonymous"></script> <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.5.0/js/bootstrap.min.js" integrity="sha384-OgVRvuATP1z7JjHLkuOU7Xw704+h835Lr+6QL9UvYjZE3Ipu6Tp75j7Bh/kR0JKI" crossorigin="anonymous"></script> <div class="container"> <br> <div class="jumbotron"> <h1 class="display-4">Send Message</h1> <br> <input id="name" class="form-control" placeholder="name"> <br> <textarea id="message" class="form-control" placeholder="message"></textarea> <br> <button id="Send" class="btn btn-success">Send</button> </div> <div id="messages"> </div> </div> <script> $(() => { $('#Send').click(()=>{ var message = {name: $("name").val(), message: $("message").val()} postMessages(message) }) getMessages() }) function addMessage(message){ $("#messages").append(`<h4>${message.name}</h4> <p>${message.message}</p>`) } function getMessages(){ $.get('http://localhost:3000/messages',(data)=>{ data.forEach(addMessage); }) } function postMessages(message){ $.post('http://localhost:3000/messages',message) } </script>

2. 我的 server.js 文件是

 var express = require('express') var bodyParser = require('body-parser') var app = express() app.use(express.static(__dirname)) app.use(bodyParser.json()) app.use(bodyParser.urlencoded({extended: false})) var messages = [ {name: 'Tim', message: 'Hi'}, {name: 'Jane', message: 'Hello'} ] app.get('/messages', (req, res) =>{ res.send(messages) }) app.post('/messages', (req, res) =>{ console.log(req.body) messages.push(req.body) res.sendStatus(200) }) var server = app.listen(3000, () => { console.log('server is listening on port', server.address().port) })

3. 我的 output

可以看出，按下发送按钮后，我在名称和消息部分中未定义

Answer 1

问题在于您的表单处理，特别是var message = {name: $("name").val(), message: $("message").val()}应该是var message = {name: $("#name").val(), message: $("#message").val()}

基本上，您试图通过标签而不是 id 获取元素。