使用 Amazon Cognito 托管 UI 进行注册和登录 - Amazon Cognito
Amazon Web Services 文档中描述的 Amazon Web Services 服务或功能可能因区域而异。要查看适用于中国区域的差异,请参阅 中国的 Amazon Web Services 服务入门 (PDF)

使用 Amazon Cognito 托管 UI 进行注册和登录

Amazon Cognito 托管 UI 为您提供 OAuth 2.0 合规授权服务器。它提供了终端用户流的默认实现,例如注册、身份验证等。您可以通过更改用户池配置来自定义用户流,例如添加多重身份验证 (MFA)。您的应用程序将重定向到托管 UI,它将处理用户流。可以通过提供品牌特定徽标以及自定义托管 UI 元素的设计来定制用户体验。Amazon Cognito 托管 UI 还允许您添加功能,让终端用户可使用社交服务提供商(Facebook、Amazon、Google 和 Apple)、任何 OpenID Connect(OIDC)合规和 SAML 提供商登录。

使用 Amazon Amplify 设置托管 UI

如果您使用 Amazon Amplify 向 Web 或移动应用程序添加身份验证功能,则可以使用 Amazon Amplify 框架中的命令行界面 (CLI) 和库来设置托管 UI。要向应用程序添加身份验证功能,您可以使用 Amazon Amplify CLI 将 Auth 类别添加到项目中。然后,在客户端代码中,您可以使用 Amazon Amplify 库,通过 Amazon Cognito 用户池对用户进行身份验证。

您可以显示预构建的托管 UI,也可以通过重定向到社交登录提供商(例如 Facebook、Google、Amazon 或 Apple)的 OAuth 2.0 终端节点联合用户身份。用户成功通过社交服务提供商身份验证之后,如果需要,Amazon Amplify 在您的用户池中创建一个新用户,并向您的应用程序提供用户的 OIDC 令牌。

有关更多信息,请参阅您使用的应用平台的 Amazon Amplify 框架文档:

使用 Amazon Cognito 控制台设置托管 UI

Original console
创建应用程序客户端
  1. 转到 Amazon Cognito 控制台。如果出现提示,请输入 Amazon 凭证。

  2. 选择 Manage User Pools(管理用户池)。

  3. 从列表中选择一个现有用户池,或创建一个用户池

  4. 在页面左侧的导航栏上,选择在 General settings(常规设置)下的 App clients(应用程序客户端)。

  5. 选择 Add an app client(添加应用程序客户端)。

  6. 输入应用程序的名称。

  7. 除非您的授权流程有要求,否则应清除选项Generate client secret(生成客户端密钥)。客户端密钥由具有以下特点的应用程序使用:拥有可保护客户端密钥的服务器端组件。

  8. (可选)更改令牌过期设置。

  9. 选择 Auth Flows Configuration(身份验证流配置)选项。有关更多信息,请参阅用户池身份验证流程

  10. 选择 Security configuration(安全配置)。我们建议您选择 Enabled (已启用)

  11. (可选)选择 Set attribute read and write permissions(设置属性读取和写入权限)。有关更多信息,请参阅属性权限和范围

  12. 选择 Create app client(创建应用程序客户端)。

  13. 记下 App client id(应用程序客户端 ID)。

  14. 选择 Return to pool details(返回池详细信息)。

配置应用程序
  1. 从控制台页面左侧的导航栏中选择 App client settings(应用程序客户端设置)。

  2. 选择 Cognito User Pool(Cognito 用户池)作为其中一个 Enabled Identity Providers(启用的身份提供商)。

    注意

    要使用外部身份提供商(IdP)(如 Facebook、Amazon、Google 或 Apple)以及通过 OpenID Connect(OIDC)或 SAML IdP 进行登录,请首先按以下步骤配置它们,然后返回到 App client settings(应用程序客户端设置)页面以启用它们。

  3. 输入 Callback URL(回调 URL)。回调 URL 指示在用户成功登录之后将被重新导向到哪里。

  4. 输入 Sign out URL(注销 URL)。注销 URL 指示在您的用户注销后会被重新定向到哪里。

  5. 选择 Authorization code grant(授权代码授予)以返回随后更换为用户池令牌的授权代码。由于令牌绝不会直接向终端用户公开,因此它们不太可能被泄露。但是,后端需要自定义应用程序以将授权代码换成用户池令牌。出于安全原因,对于移动应用程序,强烈建议您将授权代码授予流程与代码交换的证明密钥(PKCE)一起使用。

  6. 选择 Implicit grant (隐式授予) 以便从 Amazon Cognito 将用户池 JSON Web 令牌(JWT)返回给您。当没有可用于将授权代码更换为令牌的后端时,您可以使用此流程。它对于调试令牌也很有帮助。

  7. 您可以同时启用 Authorization code grant(授权代码授予)和 Implicit code grant(隐式代码授予),然后按需使用每个授予。

  8. 除非您希望明确地排除一个允许的 OAuth 范围,否则请选中所有 Allowed OAuth scopes(允许的 OAuth 范围)的复选框。

  9. 只有在您的应用程序需要代表自己而不是代表用户请求访问令牌时才选择 Client credentials (客户端凭证)

  10. 选择 Save changes(保存更改)。

配置域
  1. 选择 Choose domain name(选择域名)。

  2. Domain name(域名)页面上,键入域前缀并检查可用性,或输入您自己的域。

  3. 记下完整的域地址。

  4. 选择 Save changes(保存更改)。

New console
创建应用程序客户端
  1. 转到 Amazon Cognito 控制台。如果出现提示,请输入 Amazon 凭证。

  2. 选择 User Pools(用户池)。

  3. 从列表中选择一个现有用户池,或创建一个用户池

  4. 选择 App integration(应用程序集成)选项卡。

  5. 选择 App clients(应用程序客户端)下的 Create an app client(创建应用程序客户端)。

  6. 选择 App type(应用程序类型):Public client(公有客户端)、Confidential client(机密客户端),或者 Other(其它)。Public client(公有客户端)通常在用户的设备上运行,并使用未经身份验证和令牌身份验证的 API。Confidential client(机密客户端)通常在您通过客户端密钥和 API 凭证信任的中央服务器上的应用程序运行,并使用授权标头和 Amazon Identity and Access Management 凭证对请求进行签名。如果您的使用案例与预配置的应用程序的 Public client(公有客户端)或 Confidential client(机密客户端)应用程序设置不同,请选择 Other(其它)。

  7. 输入 App client name(应用程序客户端名称)。

  8. 选择您希望在应用程序客户端中允许的 Authentication flows(身份验证流程)。

  9. 配置 Authentication flow session duration(身份验证流程会话持续时间)。这是您的用户在会话令牌过期之前必须完成每个身份验证质询的时间。

  10. (可选)配置令牌的到期时间。

    1. 指定应用程序客户端的 Refresh token expiration(刷新令牌的过期时间)。默认值为 30 天。您可以将其更改为 1 小时到 10 年之间的任何值。

    2. 指定应用程序客户端的 Access token expiration(访问令牌的过期时间)。默认值为 1 小时。您可以将其更改为 5 分钟到 24 小时之间的任何值。

    3. 指定应用程序客户端的 ID token expiration(ID 令牌的过期时间)。默认值为 1 小时。您可以将其更改为 5 分钟到 24 小时之间的任何值。

      重要

      如果您使用托管 UI 并将令牌生命周期配置为不到一小时,用户将能够根据其会话 Cookie 持续时间使用令牌,该 Cookie 当前固定在一小时。

  11. 选择 Generate client secret(生成客户端密钥),让 Amazon Cognito 为您生成一个客户端密钥。客户端密钥通常与机密客户端关联。

  12. 是否为此应用程序客户端选择 Enable token revocation(启用令牌撤消)。这会增加令牌的大小。有关更多信息,请参阅撤消令牌

  13. 是否为此应用程序客户端选择 Prevent error messages that reveal user existence(防止暴露用户存在的错误消息)。Amazon Cognito 将响应不存在的用户的登录请求,并显示一条指出用户名或密码不正确的通用消息。

  14. (可选)为此应用程序客户端配置 Attribute read and write permissions(属性读取和写入权限)。您的应用程序客户端有权限读取和写入用户池属性架构的有限子集。

  15. 选择 Create(创建)。

  16. 记下 Client id(客户端 ID)。这将识别注册和登录请求中的应用程序客户端。

配置应用程序
  1. App integration(应用程序集成)选项卡的 App clients(应用程序客户端)下,选择您的应用程序客户端。检查当前 Hosted UI(托管 UI)信息。

  2. Allowed callback URL(s)(允许的回调 URL)下选择 Add a callback URL(添加回调 URL)。回调 URL 是在用户成功登录之后将被重新导向的地址。

  3. Allowed sign-out URL(s)(允许的注销 URL)下选择 Add a sign-out URL(添加注销 URL)。注销 URL 是在您的用户注销后会被重新导向的地址。

  4. Identity providers(身份提供商)列表中添加至少一个列出的选项。

  5. OAuth 2.0 grant types(OAuth 2.0 授予类型)下,选择 Authorization code grant(授权代码授予)以返回随后更换为用户池令牌的授权代码。由于令牌绝不会直接向终端用户公开,因此它们不太可能被泄露。但是,后端需要自定义应用程序以将授权代码换成用户池令牌。出于安全原因,对于移动应用程序,强烈建议您将授权代码授予流程与代码交换的证明密钥(PKCE)一起使用。

  6. OAuth 2.0 grant types(OAuth 2.0 授予类型)下,选择 Implicit grant(隐式授予),以便从 Amazon Cognito 将用户池 JSON Web 令牌(JWT)返回给您。当没有可用于将授权代码更换为令牌的后端时,您可以使用此流程。它对于调试令牌也很有帮助。

  7. 您可以同时启用 Authorization code(授权代码)和 Implicit code(隐式代码),然后按需使用每个授予。如果未选中 Authorization code(授权代码)或 Implicit code(隐式代码)授权,并且您的应用程序客户端具有客户端密钥,您可以启用 Client credentials(客户端凭证)授权。只有在您的应用程序需要代表自己而不是代表用户请求访问令牌时,才选择 Client credentials(客户端凭证)。

  8. 选择您要为此应用程序客户端授权的 OpenID Connect scopes(OpenID Connect 范围)。

  9. 选择 Save changes(保存更改)。

配置域
  1. 导航到用户池的 App integration(应用程序集成)选项卡。

  2. 选择在 Domain(域)旁边的 Actions(操作),然后选择 Create custom domain(创建自定义域)或 Create Cognito domain(创建 Cognito 域)。如果您已配置用户池域,请先选择 Delete Cognito domain(删除 Cognito 域)或 Delete custom domain(删除自定义域),然后再创建新的自定义域。

  3. 输入可用的域前缀,将其与 Cognito domain(Cognito 域)结合使用。有关设置 Custom domain(自定义域)的信息,请参阅将您自己的域用于托管 UI

  4. 选择 Create(创建)。

查看您的登录页面

在 Amazon Cognito 控制台中,请在 App integration(应用程序集成)选项卡中的 App clients and analytics(应用程序客户端和分析)下,选择应用程序客户端配置中的 View Hosted UI(查看托管 UI)按钮。此按钮会将您转到托管 UI 中的登录页面,其中包含以下基本参数。

  • 应用程序客户端 id

  • 授权代码授予请求

  • 对您为当前应用程序客户端激活的所有范围的请求

  • 当前应用程序客户端列表中的第一个回调 URL

当您想要测试托管 UI 的基本功能时,View hosted UI(查看托管 UI)按钮很有用。您可以使用其他和修改后的参数自定义登录 URL。在大多数情况下,View hosted UI(查看托管 UI)链接的自动生成的参数不完全符合您的应用程序需求。在这些情况下,您必须自定义应用程序在用户登录时调用的 URL。有关登录参数键和值的更多信息,请参阅 用户群体 OIDC 和托管 UI API 端点参考

托管 UI 登录网页使用以下 URL 格式。记下 response_type。在此示例中,response_type=code 表示授权代码授予。

https://<your_domain>/oauth2/authorize?response_type=code&client_id=<your_app_client_id>&redirect_uri=<your_callback_url>

当您使用自定义参数导航到 /oauth2/authorize 端点时,Amazon Cognito 会将您重定向到 /oauth2/login 端点,或者在您具有 identity_provideridp_identifier 参数时,静默地将您重定向到 IdP 登录页面。有关绕过托管 UI 的示例 URL,请参阅 SAML 会话在 Amazon Cognito 用户池中启动

您可以使用针对隐式代码授予的以下 URL 查看托管 UI 登录网页,其中,response_type=token。成功登录后,Amazon Cognito 会将用户池令牌返回到您的 Web 浏览器的地址栏。

https://<your_domain>/login?response_type=token&client_id=<your_app_client_id>&redirect_uri=<your_callback_url>

您可以在响应中的 #idtoken= 参数后面找到 JSON Web Token (JWT) 身份令牌。

下面是来自隐式授予请求的示例响应。您的身份令牌字符串长得多。

https://www.example.com/#id_token=123456789tokens123456789&expires_in=3600&token_type=Bearer

如果未立即显示对托管 UI 页面的更改,请等待几分钟,然后刷新页面。使用 RS256 算法对 Amazon Cognito 用户池令牌进行签名。您可以使用 Amazon Lambda 解码和验证用户群体令牌,请参阅 GitHub 上的解码和验证 Amazon Cognito JWT 令牌

您的域将显示在 Domain name(域名)页面上。您的应用程序客户端 ID 和回调 URL 将显示在 App client settings(应用程序客户端设置)页面上。

注意

Amazon Cognito 托管的 UI 不支持自定义身份验证流程。

Amazon Cognito 托管 UI 不支持自定义跨源资源共享 (CORS) 源策略。Amazon Cognito 向所有请求返回 Access-Control-Allow-Origin: * 响应标头。托管 UI 中的 CORS 策略将阻止用户在其请求中传递身份验证参数。应在应用程序的 Web 前端中实施 CORS 策略。