【问题标题】:How to get data from url into post request?如何从 url 获取数据到 post 请求中?
【发布时间】:2021-10-03 18:57:56
【问题描述】:

任何帮助表示赞赏。我有一个从谷歌图书 api 中提取数据的应用程序。从每个书页,用户都可以发表评论。评论的路径是/review/${isbn Number}。每个页面都有一个基于 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 号码,但没有成功。我想我的格式错误。

【问题讨论】:

    标签: javascript post insomnia


    【解决方案1】:

    第一个控制台记录你的请求

    您应该会看到包含一些数据的正文。

    在获取请求中,它们是 URL 中的参数。

    在 Psot 请求中,它们位于请求正文中。

    【讨论】:

      猜你喜欢
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 2016-08-01
      • 2020-08-15
      • 2020-03-15
      • 2016-11-17
      • 1970-01-01
      • 2019-11-26
      相关资源
      最近更新 更多