Next JS 如何在没有错误的情况下在 api 中设置 cookie？答案

【问题标题】：Next JS How can i set cookies in an api without errors?Next JS 如何在没有错误的情况下在 api 中设置 cookie？
【发布时间】：2022-09-28 14:26:25
【问题描述】：

下一个JS。我正在尝试在我的 /api/tokencheck 端点中设置一些 cookie。这是代码的一个非常简化的版本：

import { serialize } from \'cookie\';

export default (req, res) => {
  /* I change this manually to simulate if a cookie is already set */
  let cookieexists = \'no\';

  async function getToken() {
    const response = await fetch(\'https://getthetokenurl\');
    const data = await response.json();
    return data.token;
  }

  if (cookieexists === \'no\') {
    getToken().then((token) => {
      res.setHeader(\'Set-Cookie\', serialize(\'token\', token, { path: \'/\' }));
    });
    return res.status(200).end();
  } else {
    return res.status(200).end();
  }
};

我已经尝试了很多关于将我的 return.res.status... 代码放在哪里的变体，并尝试了许多不同的方法来返回成功代码，但是根据我放置代码的位置，我最终会得到任何一个以下错误：

\"API 在没有发送 /api/checkguestytoken 响应的情况下解析，这可能会导致请求停止。\"

或者

\"unhandledRejection: 错误 [ERR_HTTP_HEADERS_SENT]: 发送到客户端后无法设置标头\"

我似乎对 API 在 Next JS 中的工作方式有一些了解，因为我无法弄清楚如何运行异步函数、获取结果、设置几个 cookie，然后以 200 退出。有人可以告诉我我做错了什么？

您必须 await getToken() 调用，以便在承诺解决后返回语句。我建议切换到async/await 语法以按顺序执行，例如const token = await getToken(); res.setHeader(...); return res.status(200).end();。

标签： cookies next.js

【解决方案1】：

在Promise 解决后尝试返回：

return getToken()
  .then((token) => {
    res.setHeader('Set-Cookie', serialize('token', token, { path: '/' }));
    return res.status(200).send('Success');
  })
  .catch((err) => {
    return res.status(400).send('Server error');
  });

【讨论】：

谢谢@Ipizzinidev。试过这个，我得到：“API 已解决，但未发送 /api/checkguestytoken 的响应，这可能会导致请求停止。”代码有效，我只剩下错误/警告。也许我可以忽略警告...
@Wittner 尝试将 .end() 更改为 .send()
您需要在getToken() 之前使用return 才能按预期工作，即return getToken().then(...).catch(...);。