基于Cognito设置HttpOnly Cookies：自定义登录页的令牌存储问询

你的核心需求是自定义登录页+HTTP Only Cookie存令牌+客户端无法直接访问令牌，当前API Gateway+Lambda的思路可行，但可以通过简化架构来优化流程，以下是更优的实现方案：

优化方案：Lambda URL 直接作为自定义认证端点 #

跳过API Gateway，直接用Lambda URL作为登录/令牌刷新的端点，减少组件层级，简化开发和维护：

1. 创建带CORS配置的Lambda URL #

给处理登录逻辑的Lambda函数配置Lambda URL，开启CORS并指定你的前端域名作为允许的源，同时开启Allow credentials（因为要传递Cookie）。

2. Lambda中完成Cognito认证并设置HTTP Only Cookie #

在Lambda代码中调用Cognito SDK完成用户认证，然后通过响应头将令牌设置为HTTP Only Cookie：

const { CognitoIdentityProviderClient, InitiateAuthCommand } = require("@aws-sdk/client-cognito-identity-provider");

exports.handler = async (event) => {
  // 解析前端传入的登录参数
  const { username, password, clientId } = JSON.parse(event.body);
  const cognitoClient = new CognitoIdentityProviderClient({ region: "你的AWS区域" });

  // 调用Cognito用户认证接口
  const authCommand = new InitiateAuthCommand({
    AuthFlow: "USER_PASSWORD_AUTH",
    ClientId: clientId,
    AuthParameters: {
      USERNAME: username,
      PASSWORD: password
    }
  });

  const authResult = await cognitoClient.send(authCommand);
  const { AccessToken, RefreshToken } = authResult.AuthenticationResult;

  // 设置HTTP Only Cookie响应头
  const cookieHeaders = [
    `access_token=${AccessToken}; HttpOnly; Secure; SameSite=Strict; Path=/; Domain=你的前端域名`,
    `refresh_token=${RefreshToken}; HttpOnly; Secure; SameSite=Strict; Path=/; Domain=你的前端域名`
  ];

  return {
    statusCode: 200,
    headers: {
      "Set-Cookie": cookieHeaders,
      "Access-Control-Allow-Origin": "你的前端域名",
      "Access-Control-Allow-Credentials": true
    },
    body: JSON.stringify({ success: true })
  };
};

3. 前端编程式登录请求 #

前端通过fetch或axios发起带credentials: 'include'的POST请求，无需处理令牌，浏览器会自动保存HTTP Only Cookie：

// 前端登录示例
async function login(username, password) {
  try {
    const response = await fetch("你的Lambda URL", {
      method: "POST",
      headers: { "Content-Type": "application/json" },
      credentials: "include",
      body: JSON.stringify({
        username,
        password,
        clientId: "你的Cognito客户端ID"
      })
    });
    const result = await response.json();
    if (result.success) {
      // 登录成功，跳转或更新页面状态
    }
  } catch (err) {
    // 处理登录错误
  }
}

额外优化与安全建议 #

• 令牌刷新：同样用Lambda URL实现刷新端点，前端发起请求时浏览器自动携带refresh token的Cookie，Lambda验证后返回新的access token并更新Cookie；
• 安全加固：生产环境必须开启Secure Cookie（仅HTTPS传输），设置合适的Domain和Path限制Cookie作用范围；给Lambda URL配置IAM策略，仅允许你的前端域名访问；
• 复用Cognito逻辑：如果不想完全自定义认证流程，可以使用Cognito的自定义认证触发器，但依然保留自定义登录页，这种方式能复用Cognito的密码重置、MFA等功能。

方案优势 #

• 移除API Gateway层，降低架构复杂度和成本；
• 流程简洁，前端仅需发起登录请求，无需处理令牌；
• 完全自定义登录页，不依赖托管UI或第三方服务；
• 令牌始终以HTTP Only Cookie存储，彻底避免XSS攻击导致的令牌泄露风险。

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