Javascript 如何在next.js中处理post请求？

我想使用next.js在我的api文件夹中设置一个

POST

路由，我将数据发送到路由，但我无法解析数据以实际将其保存在数据库中。在next.js中处理

POST

路由的最佳方法是什么。特别是解析

JSON

格式的数据？

要使POST请求在Next.js API路由中工作，您可能需要做3件事

• 将方法限制为

  POST

• 使用

  JSON.parse（）

  解析路由中的JSON
• 向后端发送请求

API路由 默认情况下，Next.js中的API路由支持所有类型的请求，包括GET、POST、DELETE等。因此，虽然不需要，但最好将路由限制为您想要支持的方法

在您的情况下，如果您只想支持某个路由上的

POST

请求，可以使用

req.method

过滤掉非POST请求

if (req.method !== 'POST') {
  res.status(400).send({ message: 'Only POST requests allowed' })
  return
}

要解析JSON，只需使用

JSON.parse（）

将它们放在一起，您的API路由应该如下所示：

// pages/route-name.js

export default function handler(req, res) {
  if (req.method !== 'POST') {
    res.status(400).send({ message: 'Only POST requests allowed' })
    return
  }

  const body = JSON.parse(req.body)

  // the rest of your code
}

发送请求 最后，您需要将POST请求从前端代码发送到后端。您可能已经知道如何做到这一点，但提到这一点是为了完整性

fetch（“/api/route name”{
方法：“POST”，
标题：{
“内容类型”：“应用程序/json”，
},
正文：JSON.stringify（objectWithData），
})

简而言之，您不必担心

fetch

与Next.js的跨浏览器兼容性。Next.js

// pages/route-name.js

export default function handler(req, res) {
  if (req.method !== 'POST') {
    res.status(400).send({ message: 'Only POST requests allowed' })
    return
  }

  const body = JSON.parse(req.body)

  // the rest of your code
}