Почему req.body.title показывает «undefined»

Я новичок в NODE JS и практикуюсь с некоторыми формами POST из PUG на сервер NODE JS. У меня есть простая форма для обновления названия и описания фотографии, размещенных на mongodb. Когда я отправляю форму из веб-браузера, ввод данных возвращается на сервер как «неопределенный».

Эти два процесса в журнале POST «не определены»: (см. Ниже более полный код)

  console.info("title:", req.body.title)
  console.info("description", req.body.description)

Вместо этого я попытался использовать PUT. Странно, я делал это раньше, и это сработало. Так что не знаю в чем дело...

маршрутизатор, обрабатывающий запрос POST:

//users.js
const express = require('express');
const router = express.Router();
const app = express();
const multer = require('multer');
const photoController = require('../controllers/photoController');
const flash = require('express-flash');
const Photo = require('../models/photoModel');
const upload = multer({
  storage: photoController.storage,
  fileFilter: photoController.imageFilter
});

// flash messaging
router.use(flash());

router.get('/', (req, res, next)=>{
  Photo.find({})
    .then((photos)=>{
      res.render('photos', {
        photos : photos,
        flashMsg: req.flash("fileUploadError")
      });
    })
    .catch((err)=>{
      if (err) {
        res.end("ERROR!");
      }
    });
});


router.get('/:photoid', (req, res, next)=>{
  console.info("finding "+req.params.photoid);
  Photo.findOne({'_id': req.params.photoid})
    .then((photo)=>{
      res.render('updatePhoto', {
        photo: photo,
        flashMsg: req.flash("photoFindError")
      });
    }).catch((err)=>{
      if (err) console.info(err);
    });
});

// I think the error is below!!
router.post('/:photoid', (req, res, next)=>{
  console.info("title:", req.body.title)
  console.info("description", req.body.description)
  Photo.findOne({'_id': req.params.photoid})
    .then((photo)=>{
      var data  = {
         title: req.body.title,
         description: req.body.description
         }
      photo.set(data);
      photo.save().then(()=>{
        res.redirect('/photos');
      });
    })
    .catch((err)=>{
      if (err) console.info(err);
  });
});

Форма МОПС:

.row
   .col-md-6.col-md-offset-3
      if flashMsg.length > 0
        .alert.alert-danger <strong>FLASH!</strong>#{flashMsg}
      p Title: #{photo.title} 
      p Description: #{photo.description}
      p Size: #{photo.size} | Filename: #{photo.originalname} | Uploaded: #{photo.createdAt}| Modified: #{photo.updatedAt}
      img(src=photo.imageurl, width = "250")
      form(method='POST' action = "/photos/"+photo._id enctype = "multipart/form-data")
        div.form-group
          label(for='name') Photo Title :
          input#name.form-control(type='text', value=photo.title name='title')
        div.form-group
          label(for='email') Description:
          input#email.form-control(type='text', value=photo.description name='description')
        div.form-group
          label(for='image') Image:
          input#name.form-control(type='hidden', name='_id' value=photo._id)
        button.btn.btn-primary(type='submit') Update Your Photo

Спасибо за вашу помощь

Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией
Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией
В JavaScript одним из самых запутанных понятий является поведение ключевого слова "this" в стрелочной и обычной функциях.
Концепция локализации и ее применение в приложениях React ⚡️
Концепция локализации и ее применение в приложениях React ⚡️
Локализация - это процесс адаптации приложения к различным языкам и культурным требованиям. Это позволяет пользователям получить опыт, соответствующий...
Улучшение производительности загрузки с помощью Google Tag Manager и атрибута Defer
Улучшение производительности загрузки с помощью Google Tag Manager и атрибута Defer
В настоящее время производительность загрузки веб-сайта имеет решающее значение не только для удобства пользователей, но и для ранжирования в...
Безумие обратных вызовов в javascript [JS]
Безумие обратных вызовов в javascript [JS]
Здравствуйте! Юный падаван 🚀. Присоединяйся ко мне, чтобы разобраться в одной из самых запутанных концепций, когда вы начинаете изучать мир...
Система управления парковками с использованием HTML, CSS и JavaScript
Система управления парковками с использованием HTML, CSS и JavaScript
Веб-сайт по управлению парковками был создан с использованием HTML, CSS и JavaScript. Это простой сайт, ничего вычурного. Основная цель -...
JavaScript Вопросы с множественным выбором и ответы
JavaScript Вопросы с множественным выбором и ответы
Если вы ищете платформу, которая предоставляет вам бесплатный тест JavaScript MCQ (Multiple Choice Questions With Answers) для оценки ваших знаний,...
0
0
30
1
Перейти к ответу Данный вопрос помечен как решенный

Ответы 1

Ответ принят как подходящий

Вы должны добавить в свой код промежуточное ПО app.use(express.json()), чтобы автоматически анализировать req.body из вашего запроса.

const express = require('express');
const router = express.Router();
const app = express();
app.use(express.json()); // Here
const multer = require('multer');
const photoController = require('../controllers/photoController');
const flash = require('express-flash');
const Photo = require('../models/photoModel');
const upload = multer({
  storage: photoController.storage,
  fileFilter: photoController.imageFilter
});

более простым решением было удалить enctype = "multipart/form-data". тогда это сработало

Katie Melosto 16.03.2022 19:06

Другие вопросы по теме