Почему в результате req.body пустой?

Question

Сервер:

const express = require('express');
const mailer = require('nodemailer');
const exphbs = require('express-handlebars');
const bodyParser = require('body-parser');

const app = express();
const hbs = exphbs.create({
    defaulLayout: 'main',
    extname: 'hbs'
});

app.engine('hbs', hbs.engine);
app.set('view engine', 'hbs');

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

const transporter = mailer.createTransport({
    service: 'Gmail',
    auth: {
        user: '[email protected]',
        pass: 'KursovayaMoya'
    }
});

async function startMailing({ to, subject, text, html = null }) {
    await transporter.sendMail({
        from: '[email protected]',
        to: to,
        subject: subject,
        text: text,
        html: html
    });
}
 
app.get('/', (req, res) => {
    res.render('home', {test: 'test'});
});

app.post('/send', (req, res) => {
    console.log(req.body);
});

app.listen(5000, () => {
    console.log('Server has been started at port 5000...');
});

Форма:

<div class="container d-flex justify-content-center p-4 mt-3 border rounded">
    <form action="/send" method="post" enctype="multipart/form-data" class="w-100">
        <h1>Email рассылка</h1>
        
        <div class="form-group mt-3">
        <label for="emailFrom">От кого:</label>
            <input type="email" class="form-control" id="emailFrom" name="emailFrom" aria-describedby="emailHelp">
            <small id="emailHelp" class="form-text text-muted">Например: "[email protected]"</small>
        </div>

        <div class="row d-flex align-items-center">
            <div class="col">
                <div class="form-check">
                    <input class="form-check-input" type="radio" name="email" id="textEmail" name="textEmail" checked>
                    <label class="form-check-label" for="textEmail">Вручную</label>
                </div>
                <div class="form-check">
                    <input class="form-check-input" type="radio" name="email" id="fileEmail" name="fileEmail">
                    <label class="form-check-label" for="fileEmail">Файл(.txt, .xlsx)</label>
                </div>
            </div>
            <div class="col">
                <div class="form-group mt-3" id="textEmailBlock">
                    <label for="textEmailTo">Email адреса:</label>
                        <input type="email" multiple class="form-control" id="textEmailTo" name="textEmailTo" aria-describedby="emailHelp">
                        <small id="emailHelp" class="form-text text-muted">Например: "[email protected], [email protected]"</small>
                </div>
                <div class="custom-file mt-3" id="fileEmailBlock">
                    <input type="file" class="custom-file-input" id="fileEmailTo" name="fileEmailTo">
                    <label class="custom-file-label" for="fileEmailTo">Выберете файл</label>
                </div>
            </div>
        </div>        

        <div class="form-group mt-3">
            <label for="subject">Тема:</label>
            <input type="text" class="form-control" id="subject" aria-describedby="subject">
        </div>

        <div class="form-check">
            <input class="form-check-input" type="radio" name="textMessage" id="textMessage" checked>
            <label class="form-check-label" for="textMessage">Текст</label>
        </div>
        <div class="form-check">
            <input class="form-check-input" type="radio" name="fileMessage" id="fileMessage">
            <label class="form-check-label" for="fileMessage">Файл(.html)</label>
        </div>

        <div class="form-group mt-3" id="textMessageBlock" name="textMessageBlock">
            <label for="textMessageTo">Текст:</label>
            <textarea class="form-control" id="textMessageTo" rows="3"></textarea>
        </div>
        <div class="custom-file mt-3" id="fileMessageBlock">
            <input type="file" class="custom-file-input" id="fileMessageTo" name="fileMessageTo">
            <label class="custom-file-label" for="fileMessageTo">Выберете файл</label>
        </div>

        <button type="submit" class="btn btn-primary mt-3">Отправить</button>
    </form> 
</div>

body-parser есть, через express.json() и express.urlencoded({ extended: true }) пробовал, но всё равно req.body = {}.

Answer 1

Из-за наличия файловых полей ваша форма посылается с:

Content-Type: multipart/form-data

multer - библиотека, которая обычно используется для обработки данных такого типа на сервера.

multer - is a node.js middleware for handling multipart/form-data, which is primarily used for uploading files.

const path = require('path');
const express = require('express');
const exphbs = require('express-handlebars');
const bodyParser = require('body-parser');
const multer = require('multer');

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

const upload = multer({
  dest: path.join(__dirname, 'uploads')
});

const hbs = exphbs.create({
  defaultLayout: 'main',
  extname: 'hbs'
});
app.engine('hbs', hbs.engine);
app.set('view engine', 'hbs');
app.set('views', path.join(__dirname, 'views'));


app.get('/', (req, res) => {
  res.render('home', { test: 'test' });
});

app.post(
  '/send',
  upload.fields([{name: 'fileEmailTo'}, {name: 'fileMessageTo'}]),
  (req, res) => {
    console.log(req.body);
    res.status(204).json({});
  }
);

app.listen(5000, () => {
  console.log('Server has been started at port 5000...');
});

Результат:

[Object: null prototype] {
  emailFrom: '[email protected]',
  email: 'on',
  textEmailTo: '',
  textMessage: 'on'
}

БЛОГ НА HUSL

Почему в результате req.body пустой?

Ответы (1 шт):