生产环境下NextJS Cookie无法发送至NodeJS服务器问题排查

核心问题定位 #

生产环境下主域https://ikhlaas.pk的前端请求子域https://api.ikhlaas.pk的后端接口时，未携带登录时设置的Cookie，导致401错误。本地环境正常是因为同域（localhost），浏览器默认允许Cookie发送。

具体修复步骤 #

1. 修复前端请求的withCredentials配置 #

你的makeGetRequest函数中，通过withToken参数覆盖了全局axios实例的withCredentials: true配置，当请求受保护接口（如/dashboard/orders对应的API）时，如果传入withToken: false，会直接导致Cookie不被携带。

修复方案：
去掉请求级别的withCredentials覆盖，因为全局axios实例已经配置了withCredentials: true，所有需要携带Cookie的请求会自动处理：

async function makeGetRequest(
  url: string,
  config: AxiosRequestConfig<any> = {}
): Promise<AxiosResponse | undefined> {
  try {
    const response = await apiClient.get(url, {
      ...config
      // 移除这行：withCredentials: withToken ? true : false,
    });
    return response;
  } catch (error) {
    if (axios.isAxiosError(error) && error.response) {
      return Promise.reject(error.response);
    }
    return Promise.reject(error);
  }
}

如果确实需要区分是否携带Cookie的场景，确保调用makeGetRequest时，对受保护接口传入withToken: true。

2. 验证Cookie的浏览器存储状态 #

登录成功后，打开浏览器DevTools -> Application -> Cookies -> https://api.ikhlaas.pk，检查：

• 是否存在以用户ID命名的Cookie
• Cookie的Domain是否为.ikhlaas.pk（确保主域前端可访问）
• Secure是否为true（HTTPS环境必须）
• SameSite是否为None（跨域场景必须）

如果Cookie未存储，检查后端loginUser接口的响应头是否包含正确的Set-Cookie字段。

3. 确认CORS配置的完整性 #

当前后端CORS配置已经包含credentials: true和允许https://ikhlaas.pk的origin，这部分是正确的。但注意：

• 本地前端（HTTP）访问生产后端（HTTPS）时，Secure: true的Cookie不会被发送（浏览器安全策略），这属于正常现象，无需处理。
• 确保没有其他中间件（如代理、反向代理）修改了CORS响应头或Cookie。

4. 优化Cookie名称的兼容性 #

你使用用户ID作为Cookie名称，部分特殊字符可能导致浏览器无法识别，建议改为固定名称（如access_token），避免潜在问题：

// 后端修改Cookie名称
res.cookie("access_token", accessToken, {
  expires: tokenExpiry,
  httpOnly: true,
  secure: true,
  sameSite: "none",
  domain: ".ikhlaas.pk",
});

验证步骤 #

1. 部署修复后的前端代码
2. 登录https://ikhlaas.pk/login，检查Cookie是否正确存储
3. 访问https://ikhlaas.pk/dashboard/orders，查看Network请求的Request Headers是否包含Cookie字段

内容的提问来源于stack exchange，提问作者Rana Faraz