如何在自定义Cognito UI（JavaScript）中集成Google IDP

当你通过外部IDP（如Google）授权后，Cognito会将code参数返回给自定义UI的回调地址，此时不能使用用户名密码登录的InitiateAuthCommand（USER_PASSWORD_AUTH流程），需要通过**授权码授权流程（Authorization Code Grant）**来换取Cognito令牌，具体实现如下：

核心逻辑 #

外部IDP授权完成后，将回调得到的code、预配置的回调地址、Cognito客户端ID等参数传入InitiateAuthCommand，指定AuthFlow为AUTHORIZATION_CODE_AUTH，即可获取Cognito的身份令牌、访问令牌和刷新令牌。

具体步骤 #

1. 确认依赖 #

确保已安装AWS JS SDK V3的Cognito客户端包：

npm install @aws-sdk/client-cognito-identity-provider

2. 初始化Cognito客户端 #

创建CognitoIdentityProviderClient实例，配置你的AWS区域：

import { CognitoIdentityProviderClient, InitiateAuthCommand } from "@aws-sdk/client-cognito-identity-provider";

const cognitoClient = new CognitoIdentityProviderClient({
  region: "us-east-1" // 替换为你的Cognito用户池所在区域
});

3. 构造命令参数并换取令牌 #

编写函数处理code参数，调用InitiateAuthCommand完成令牌兑换：

async function getTokensFromCode(code) {
  const authParams = {
    AuthFlow: "AUTHORIZATION_CODE_AUTH",
    ClientId: "你的Cognito应用客户端ID", // 从Cognito控制台获取
    AuthParameters: {
      CODE: code,
      REDIRECT_URI: "https://你的自定义回调地址" // 必须和控制台配置的回调地址完全一致
    }
  };

  // 若Cognito客户端设置了"Require Secret"，需添加SECRET_HASH参数
  // authParams.AuthParameters.SECRET_HASH = calculateSecretHash(
  //   authParams.ClientId,
  //   "你的客户端Secret",
  //   "用户用户名"
  // );

  try {
    const command = new InitiateAuthCommand(authParams);
    const response = await cognitoClient.send(command);
    const { IdToken, AccessToken, RefreshToken } = response.AuthenticationResult;
    
    // 可将令牌存储到localStorage或用于后续业务请求
    return { IdToken, AccessToken, RefreshToken };
  } catch (err) {
    console.error("令牌兑换失败:", err);
    throw err;
  }
}

// 计算SECRET_HASH的工具函数（仅适用于带Secret的客户端）
function calculateSecretHash(clientId, clientSecret, username) {
  const crypto = require("crypto");
  return crypto
    .createHmac("SHA256", clientSecret)
    .update(username + clientId)
    .digest("base64");
}

4. 在回调页面处理code参数 #

从URL中提取code并调用兑换函数：

// 提取URL中的code参数
const urlParams = new URLSearchParams(window.location.search);
const code = urlParams.get("code");

if (code) {
  getTokensFromCode(code)
    .then(tokens => {
      // 处理令牌，比如跳转首页、初始化用户会话
    })
    .catch(err => {
      // 处理错误，比如提示用户重新登录
    });
}

关键注意事项 #

• 回调地址一致性：REDIRECT_URI必须和Cognito控制台中Allowed Callback URLs的配置完全一致，包括协议（http/https）、域名、路径，否则会触发验证错误。
• 客户端权限配置：确保Cognito客户端的Allowed OAuth Flows包含Authorization code grant，Allowed OAuth Scopes包含openid、email等所需权限范围。
• Secret处理：SPA等公开客户端建议不要设置客户端Secret，避免泄露风险；若必须设置，需严格计算并传入SECRET_HASH。
• 令牌有效期：Cognito的IdToken和AccessToken默认有效期1小时，可通过RefreshToken定期刷新令牌以维持会话。

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