Express JS POST 请求

Question

我正在尝试执行一个基本的 POST 请求，该请求将电子邮件地址存储在一个变量中，然后将其显示在控制台中。该页面的 URL 是：http://localhost:3000/email-adress（我知道它在地址上缺少一个额外的 d）。

出于某种原因，代码无法正常工作，有什么想法吗？

快递

const express = require('express')
const router = express.Router()

router.post('/email-adress', (req, res) => {
  var email = req.body.email
  console.log(email)
})

module.exports = router

HTML

<form action="/finished" method="post">
<label class="" for="email">Email address</label>
<input class="" id="email" name="email" type="text">
<button type="submit" class="">Continue</button>  
</form>

Answer 1

这里有几件事。首先，当有人导航到 url 时，在您的示例 localhost:3000/email-adress 中（顺便说一句，它仅适用于您的机器），浏览器正在向 /email-adress 发出 GET 请求] 路线。我不确定您的其他快递代码是什么，但您必须有一条路线来处理这个问题，以便为您的表格提供服务。现在，将表单提供给前端，如果您想触发 POST 路由中的代码到 /email-adress，您将必须通过 fetch.[=20= 执行此操作]

我假设您希望在提交表单后发生这种情况。为此，请通过 JavaScript 处理表单的提交。摆脱 action 和 method 属性，并执行如下操作：

document.querySelector('form').addEventListener('submit', onSubmit)

function onSubmit(e) {
  fetch('/email-adress', {
    method: 'POST',
    body: JSON.stringify({ email: e.target.email.value })
  })
}

现在，提交表单后，您应该会在服务器上看到 console.log。

Answer 2

感谢 Jaxi，我找到了答案。我所做的是在 /email-adress 上执行 POST 而不是 /finished 所以我将 Express 代码修改为：

const express = require('express')
const router = express.Router()

router.post('/finished', (req, res) => {
  var email = req.body.email
  console.log(email)
  res.render('finished')
})

module.exports = router

问题解决了！

Express JS POST 请求

Express JS POST Request

html

javascript

routing

express