使用cookies-next的setCookie将URL参数token设为Cookie失败求助

你遇到的问题核心是在服务器端调用setCookie时没有传入响应对象res，cookies-next在服务端环境下必须依赖res来操作HTTP响应头，才能把Cookie发送给浏览器。

修改后的代码 #

import { setCookie } from "cookies-next";
import { ParsedUrlQuery } from "querystring";

function CallbackPage() {
  return null;
}

export async function getServerSideProps({
  query,
  res,
}: {
  query: ParsedUrlQuery;
  res: any;
}) {
  const { token } = query;
  if (!token) {
    return {
      redirect: {
        source: ",",
        destination: "https://youtube.com", //example
        permanent: false,
        basePath: false,
      },
    };
  } else {
    // 关键：传入res参数，让setCookie能操作响应头
    setCookie("token", token as string, { res });
    return {
      redirect: {
        destination: "/",
        permanent: false,
      },
    };
  }
}

export default CallbackPage;

为什么之前的代码不生效？ #

在Next.js的getServerSideProps里，服务器端代码需要通过res对象来写入HTTP响应头。cookies-next的setCookie方法在服务端运行时，必须拿到res才能添加Set-Cookie响应头，没有这个参数的话，方法相当于空执行，不会对浏览器产生任何Cookie设置指令。

另外要注意：必须在返回redirect之前完成Cookie设置，因为redirect会立即发送响应，之后再调用setCookie就来不及修改响应头了。

内容的提问来源于stack exchange，提问作者01gurl