如何在 post Express 中获取请求正文？

Question

我有一个在提交表单时发出 POST 请求的应用程序。但是当请求在服务器上时，我无法获取请求的正文。

这是我的 ReactJS 代码：

const onSubmit = async event => {
  try {
    event.preventDefault()
    const response = await fetch('/api/auth/login', {
      method: 'POST',
      mode: 'no-cors',
      headers: { 'Content-Type': 'application/json' },
      body: JSON.stringify({ email, password })
    })
    const result = await response.json()
  } catch (e) {
    console.error(e)
  }
}

return (
  <>
    <h1>Authorisation</h1>
    <form onSubmit={onSubmit}>
      <input name="email" value={email} onChange={e => setEmail(e.target.value)} />
      <input name="password" value={password} onChange={e => setPassword(e.target.value)} type="password"/>
      <button type="submit">Submit</button>
    </form>
  </>
)

在我的后端我有 Express：

app.use(express.json())

const login = async (req, res) => {
  try {
    console.log(req.body)              // here is always {}
    const {email, password} = req.body
    /*some code*/
  } catch (e) {
    console.log('Login error: ' + e)
  }
}

router.post('/login', login)
app.use(router)

Answer 1

我注意到您正在使用 no-cors 模式。当您使用该模式时，它会限制某些标题。

例如，这种模式只允许Content-Type 变为application/x-www-form-urlencoded、multipart/form-data 或text/plain。你可以阅读更多here

我建议你只使用cors 模式，这样你就可以使用application/json