Как получить данные из URL-адреса в post-запрос?

#javascript #post #insomnia

Вопрос:

Любая помощь будет признательна. У меня есть приложение, которое извлекает данные из google books api. На каждой странице книги пользователь может оставить отзыв. Путь к обзору — /обзор/${Номер isbn}. Каждая страница имеет путь, основанный на isbn. Маршруты проверки работают, и я могу сделать запрос на отправку через бессонницу/почтальона без проблем, у меня просто возникли проблемы с js-интерфейсом при извлечении данных из полей ввода, чтобы сделать запрос на отправку. Я не уверен, что проблема в том, что isbn находится на пути. Ниже приведен мой интерфейсный javascript, который я не могу исправить.

 const newFormHandler = async (event) => {
    event.preventDefault();
    console.log("testing")
    const description = document.querySelector('#description').value;
    const reviewTitle = document.querySelector('#reviewTitle').value;
    const isbn = window.location.search
    if (description) {
      const response = await fetch(`api/review/${isbn}`, {
        method: 'POST',
        body: JSON.stringify({ description, reviewTitle }),
        headers: {
          'Content-Type': 'application/json',
        },
      });
  
      if (response.ok) {
        document.location.reload();
      } else {
        alert('Failed to create review');
      }
    }
  };
  
  document
    .querySelector('.form-group')
    .addEventListener('submit', newFormHandler);
 

Моя форма находится ниже:

 <div class="col form-group">
      <div class ="card reviewCard" style = "background-color:#fcf8f3; color: #65625e;">
        <form id="blog-form">
            <div>
              <label for="reviewTitle">Review Title</label>
              <input
                value="{{title}}"
                id="reviewTitle"
                name="reviewtitle"
                placeholder="Enter Review Title"
                type="text"
                required="required"
                class="form-control"
                data-bv-notempty="true"
                data-bv-notempty-message="The title cannot be empty" 
              />
            </div>

          <div>
            <label for="review">Review</label>
            <textarea
              id="description"
              name="review"
              cols="40"
              rows="10"
              required="required"
              class="form-control"
            >{{description}}</textarea>
          </div>
          <div class="form-group">
            <button type="submit" class="btn btn-primary">Submit</button>
          </div>
        </form>
      </div>
    </div>

    </div>
 

И вот мой маршрут, который отлично работает с бессонницей, никаких проблем.

 
router.get('/review/:id', async (req, res) => {
  try { 
    const isbn13 = req.params['id'];
    const reviewData = await Review.findAll({ where: {
    isbn:isbn13
  }, 
  include: [
    {
      model: User,
      attributes: ['name'],
            }
      ]
  })
  const reviews = reviewData.map((review) => review.get({ plain:true}));
  // console.log(isbn13);
  res.render('review', {
    isbn: isbn13, reviews:reviews
  });
} catch (err) {
  console.log(err)
}
});
 

Любая помощь будет признательна. Я попытался вытащить номер isbn с пути, но безуспешно. Я думаю, что я как-то неправильно отформатировал его.

Ответ №1:

Первая консоль зарегистрируйте свой запрос

Вы должны увидеть тело, содержащее некоторые данные.

В запросе get они являются аргументами в URL-адресе.

В запросе Psot они находятся в теле запроса.