我需要在我的NextJS应用程序中处理POST请求。此发布请求来自其他域。
我将这个receptor.ts文件添加到/pages/api目录中：

import { NextApiRequest, NextApiResponse } from 'next';

export default function handler(req: NextApiRequest, res: NextApiResponse) {
  if (req.method === 'POST') {
    console.log('POST')
    const message = req.body.message;
    console.log(`Message: ${message}`);
    res.status(200).json({ message: "Ok" });
  } else {
    res.status(405).json({ error: "Not allowed" });
  }

  res.setHeader('Access-Control-Allow-Origin', '*');
  res.setHeader('Access-Control-Allow-Methods', 'POST');
}

在另一个应用程序中，我是这样称呼它的：

const url = `http://localhost:3000/api/receptor`;
            const data = { message: "Hello" };

            fetch(url, {
              method: "POST",
              headers: {"Content-Type": "application/json"},
              body: JSON.stringify(data)
            })
              .then(response => response.json())
              .then(data => console.log(data))
              .catch(error => console.error(error));

浏览器的控制台说：
CORS策略已阻止从源“http：//localhost：3001”访问“http：//localhost：3000/api/receptor”：对印前检查请求的响应未通过访问控制检查：请求的资源上不存在“Access-Control-Allow-Origin”标头。如果一个不透明的响应满足了你的需求，将请求的模式设置为“no-cors”，以在禁用CORS的情况下获取资源。
IDE的控制台显示：
错误-错误[ERR_HTTP_HEADERS_SENT]：将标头发送到客户端后无法设置标头
如果我在请求中添加mode: "no-cors"，那么我会得到相同的错误。
有什么解决方法吗？

• • 解决方案**

import { NextApiRequest, NextApiResponse } from 'next';

export default function handler(req: NextApiRequest, res: NextApiResponse) {
  res.setHeader('Access-Control-Allow-Origin', '*');
  res.setHeader('Access-Control-Allow-Methods', 'POST');
  res.setHeader('Access-Control-Allow-Headers', 'Content-Type');

  if (req.method === 'OPTIONS') {
    res.status(200).end();
    return;
  }

  if (req.method === 'POST') {
    console.log('POST')
    const message = req.body.message;
    console.log(`Message: ${message}`);
    res.status(200).json({ message: "Ok" });
  } else {
    res.status(405).json({ error: "Not allowed" });
  }
}

问题是我没有处理飞行前的请求。这是解决方案，我将投票结束。