NextAuth Apple登录出现PKCE code_verifier cookie缺失问题的解决方法

我用NextAuth实现Apple登录时，遇到了错误提示：PKCE code_verifier cookie was missing.。我原本以为这个Cookie是NextAuth自动处理的，但查了多篇教程都没找到相关解决方法，求帮忙。

我的NextAuth配置代码如下：

const handler = NextAuth({
  providers: [
    GoogleProvider({
      clientId: process.env.GOOGLE_CLIENT_ID?? '',
      clientSecret: process.env.GOOGLE_CLIENT_SECRET?? ''
    }),
    AppleProvider({
      clientId: process.env.APPLE_CLIENT_ID?? '',
      clientSecret: process.env.APPLE_CLIENT_SECRET?? '',
    }),

  callbacks: {
    async jwt({token, account}) {
      if (account) {
        token = Object.assign({}, token, { access_token: account.access_token, id_token: account.id_token,  refresh_token: account.refresh_token, provider: account.provider  });
      }

        return token
    },
    async session({session, token, user}) {
      console.log(`my user is ${JSON.stringify(user, null, 2)}`)
    if(session) {
      session = Object.assign({}, session, {access_token: token.access_token, id_token: token.id_token,  refresh_token: token.refresh_token, provider: token.provider})
      if (session.provider === "google") {
        try {
          console.log(`hi my name is ${session.provider}`)
          const  apiKey = process.env.API_KEY
          const response = await axios.post(
            "process.env.API_URL",
            {  authorizationCode: token.id_token, apiKey: apiKey },
            {
              headers: {
                "Content-Type": "application/json",
              },
            }
          );
          const userData = response.data;
        } catch (error) {
          console.error("Failed:", error);
        }
      }

      if(session.provider === "credentials"){
        session = Object.assign({}, session, {access_token: token.access_token, id_token: token.id_token,  refresh_token: token.refresh_token, provider: token.provider, })
      }

      }
    return session
    },
   
  },

完整错误信息：

name: 'OAuthCallbackError',
    code: undefined
  },
  providerId: 'apple',
  message: 'PKCE code_verifier cookie was missing.'

这个错误通常和NextAuth的Cookie配置、跨域设置或者PKCE流程完整性有关，以下是具体排查和修复方向：

1. 检查NextAuth的Cookie配置 #

NextAuth默认会处理PKCE的code_verifierCookie，但自定义Cookie策略可能干扰它的生成或读取。如果不需要自定义Cookie，直接移除配置中的cookies项；如果必须自定义，要保留PKCE相关Cookie的规则：

const handler = NextAuth({
  // ...其他配置
  cookies: {
    pkceCodeVerifier: {
      name: `next-auth.pkce.code_verifier`,
      options: {
        httpOnly: true,
        sameSite: "lax",
        path: "/",
        secure: process.env.NODE_ENV === "production"
      }
    },
    // 其他默认Cookie配置...
  },
  // ...
})

2. 显式指定Apple Provider的PKCE参数 #

Apple登录强制要求PKCE，可在AppleProvider中显式配置确保流程正确：

AppleProvider({
  clientId: process.env.APPLE_CLIENT_ID?? '',
  clientSecret: process.env.APPLE_CLIENT_SECRET?? '',
  authorization: {
    params: {
      response_type: "code",
      code_challenge_method: "S256"
    }
  }
}),

3. 调整跨域与SameSite设置 #

如果前后端跨域或用iframe嵌套登录，需修改Cookie的sameSite属性：

cookies: {
  pkceCodeVerifier: {
    // ...
    sameSite: process.env.NODE_ENV === "production" ? "none" : "lax",
    secure: process.env.NODE_ENV === "production"
  }
}

注意：sameSite: "none"仅适用于HTTPS环境，本地开发保持lax即可。

4. 检查登录流程完整性 #

• 禁用浏览器隐私插件（如广告拦截器），测试是否被阻止Cookie生成。
• 确认Apple开发者后台配置的回调URL与NextAuth设置完全一致（包括协议、域名）。
• 确保配置了NEXTAUTH_SECRET，缺失会导致Cookie签名失败：

const handler = NextAuth({
  secret: process.env.NEXTAUTH_SECRET,
  // ...其他配置
})

5. 修复代码语法错误 #

你的配置中providers数组后缺少闭合逗号，可能导致配置解析异常：

providers: [
  GoogleProvider(...),
  AppleProvider(...), // 补充此处逗号
], // 补充此处闭合逗号
callbacks: {
  // ...
}

内容的提问来源于stack exchange，提问作者Sahil Singh