Как извлечь req.body на стороне сервера (я использую fetch)?

Question

Я делаю проект, который состоит из отдельного внешнего интерфейса и внутреннего интерфейса. Из внешнего интерфейса я делаю POST-запрос через fetch, который должен отправить строку «ORANGE» бэкэнду, а затем бэкэнд должен записать его в консоль. Я не могу получить бэкэнд для консоли, чтобы записать строку. Я посмотрел на запрос в devtools, и там была похоронена строка «ORANGE» под «Request payload». Сам запрос был отправлен в порядке. Как мне получить доступ к строке, чтобы я мог что-то с ней сделать? (например, хранить в базе данных)

//FRONTEND
const commentForm = document.getElementById("editform");
commentForm.addEventListener('submit', function(e) { 
    e.preventDefault();
    fetch('http://localhost:3000/posts/:id', {
        mode: 'cors',
        method: 'post',
        headers: {
            "Content-type": "text/plain;charset=UTF-8"
        },
        body: "ORANGE"
    }).then(function(response) {
        if (response.ok) {
            console.log("response.ok was true: "+ response)
        } else {
            let error = new Error(response.statusText)
            error.response = response
            throw error
        }
    })
});

//BACKEND
router.post('/posts/:id', function(req, res, next) {
    console.log('What do I put here to get ORANGE logged?!')
    //On the server side I tried some console.log tests.
    //console.log("req is " + req);               //req is [object Object]
    //console.log("type of req is " + typeof req); //type of req is object
    //console.log(JSON.parse(req)); //SyntaxError: unexpected token o in JSON at position 1  
    res.send('whatever. I want ORANGE.')
}

Answer 1

В Express 4.16 модуль body-parser больше не нужен. Все, что вам нужно для получения тела:

app.use(express.urlencoded({ extended: true }));
app.use(express.json());

Используйте "Content-type": "application/x-www-form-urlencoded" внутри выборки, в противном случае CORS отправит предварительные полеты и доставит вам неприятности. (подробнее об этом требовании простого запроса Google CORS).

Answer 2

Как и в документации fetch () объяснил:

Это просто ответ HTTP, а не фактический JSON. Чтобы извлечь содержимое тела JSON из ответа, мы используем метод json () (определенный в миксине Body, который реализуется объектами Request и Response.)

const response = await fetch('http://example.com/movies.json');
const myJson = await response.json();
console.log(JSON.stringify(myJson));

, чтобы выв вашем ответе нет объекта body, только объект json, которым является ваше тело.

Answer 3

Express по умолчанию не будет обрабатывать тело запроса. Вам нужно загрузить модуль, чтобы сделать это явно.

Поскольку вы используете простой текст, вы можете использовать модуль body-parser. Это создаст свойство body по запросу:

const bodyParser = require('body-parser');
router.use(bodyParser.text({type: 'text/plain'}))
router.post('/posts/:id', function(req, res, next) {
    console.log(req.body);
    res.send('Response')
});

Обратите внимание, однако, что, как правило, лучше использовать формат структурированных данных, таких как JSON, а не простой текст.

Answer 4

Попробуйте выполнить следующее:

1. Используйте анализатор тела в файле server.js.

2. Отправить сообщение как content-type какjson следующим образом:

   headers: { Content-Type: application/json }

, а тело должно быть в формате JSON

body: {"color":"ORANGE"}

На вашем маршруте просто напечатайте

console.log(req.body.color)