I am getting undefined from express. Why req.body is showing empty object {}?

Question

This is noob question but I am new to it. Req.body is undefined. I tried without body-

parser and with body-parser, I keep getting the same result I tried all solutions

available in StackOverflow but I keep getting the same result.

This is my client side code:

document.addEventListener("DOMContentLoaded", () => {
            document.getElementById('send').addEventListener('click', (e) => {
                var message = { name: document.getElementById('name').value, message: document.getElementById('message').value }
                postMessages(message)
            })
            getMessages()

        });
        function addMessages(message) {
            const ele = document.getElementById('messages')
            const h4 = document.createElement('h4')
            const p = document.createElement('p')
            h4.textContent = `${message.name}`
            p.textContent = `${message.message}`
            ele.append(h4, p)
        }
        function postMessages(message) {
            const Url = "http://localhost:3000/messages"
            fetch(Url, {
                method: 'POST',
                body: message,
            })
        }

And this is my NodeJs code:

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.post('/messages', (req, res) => {
    console.log(req.body)
    messages.push(req.body)
    res.sendStatus(200)
})

What is the actual request body you can see in the browser dev tools? Could you post a [mcve] of the client? — jabaa, Aug 16 '22 at 17:00
VM150:1 Uncaught (in promise) SyntaxError: Unexpected token 'O', "OK" is not valid JSON — hritik, Aug 16 '22 at 17:06
Can you try `fetch(Url, { method: 'POST', body: JSON.stringiffy(message), })`? — jabaa, Aug 16 '22 at 17:09
Keep `JSON.stringify` and add this to your fetch `headers: {'Content-Type': 'application/json'}` — Pooya Raki, Aug 16 '22 at 17:15

score 2 · Answer 1 · edited Aug 17 '22 at 00:03

2

You need to change your fetch function and first JSON.stringify your message and then add correct headers:

function postMessages(message) {
        const Url = "http://localhost:3000/messages"
        fetch(Url, {
            method: 'POST',
            headers: {
                'Content-Type': 'application/json'
            },
            body: JSON.stringify(message),
        })
    }

edited Aug 17 '22 at 00:03

Patryk Falba

417
3
15

answered Aug 16 '22 at 17:25

Pooya Raki

219
1
3
17

I am getting undefined from express. Why req.body is showing empty object {}?

1 Answers1