Пустое тело в запросе на получение сообщения

Question

Я борюсь с API выборки в JavaScript. Когда я пытаюсь POST-то на мой сервер с fetch, тело запроса пустой массив. Но когда я использую Почтальон, это работает ... Вот мой код сервера в NodeJS:

const express = require('express')
const app = express()
const port = 3000

app.use(express.json())
app.post('/api', function (req, res) {
    console.log(req.body)
})
app.listen(port)

и вот мой клиент:

fetch('http://"theserverip":3000/api', {
    method: 'POST',
    headers: { "Content-Type": "application/json" },
    mode: 'no-cors',
    body: JSON.stringify({
        name: 'dean',
        login: 'dean',
    })
})
.then((res) => {
    console.log(res)
})

Проблема в том, что на стороне SERVER req.body пусто. Кто-нибудь может мне помочь? Спасибо!

Answer 1

В дополнение к отличным ответам, в которых упоминалось удаление опции mode: 'no-cors', и если вы не хотите добавлять промежуточное программное обеспечение CORS в Express, вы можете просто обработать запросы перед полетом под OPTIONS блоком:

app.options('*', (req, res) => {
  res.setHeader('Access-Control-Allow-Origin', '*');
  res.setHeader('Access-Control-Allow-Headers', 'Content-Type'); // Add other headers here
  res.setHeader('Access-Control-Allow-Methods', 'POST'); // Add other methods here
  res.send();
});

Еще один хороший ответ здесь: https://www.vinaygopinath.me/blog/tech/enable-cors-with-pre-flight/

Надеюсь, это поможет!

Answer 2

Проблема в

mode: 'no-cors'

Из документации ...

Предотвращает использование метода чем-либо кроме HEAD, GET или POST, и заголовки, отличные от простых заголовков

Ограничение simple типа содержимого заголовка позволяет

• text/plain,
• application/x-www-form-urlencoded и
• multipart/form-data

В результате ваш красиво обработанный заголовок Content-Type: application/json станет content-type: text/plain (по крайней мере, при тестировании через Chrome).

Поскольку ваш сервер Express ожидает JSON, он не будет анализировать этот запрос.

Я рекомендую пропустить конфигурацию mode.Вместо этого здесь используется опция "cors" по умолчанию.

---

Поскольку ваш запрос не простой , вы, вероятно, захотите добавить несколько CORSпромежуточное программное обеспечение для вашего сервера Express.

Другой (слегка взломанный) вариант - указать Express анализировать text/plain запросы как JSON.Это позволяет отправлять строки JSON в виде простых запросов, что также позволяет избежать предварительного запроса OPTIONS, что снижает общий сетевой трафик ...

app.use(express.json({
  type: ['application/json', 'text/plain']
}))

РЕДАКТИРОВАТЬ: добавлена ​​конечная скобка в app.useокончательный кодовый блок.

Answer 3

Пожалуйста, смотрите документ mode , no-cors mode отправляйте только простые заголовки.Поэтому тип содержимого изменен на text/html; вместо application/json, поэтому ваш сервер не может распознать формат тела и вернуть пустой.

Удалите mode: 'no-cors',, и все будет в порядке.

Answer 4

Если вы хотите получить ответ, используя fetch , рассмотрите возможность использования res.send :

    app.post('/api', function (req, res) {
        res.send(req.body)
    })