我可以使用我自己的登錄表單進行 aws cognito 嗎？

Question

我有一個使用 aws cognito 進行身份驗證的 nextjs 應用程序。 我想知道是否有辦法用我自己的自定義表單替換 aws 提供的托管 ui。

import { Domain } from "@material-ui/icons";
import NextAuth from "next-auth";
import Providers from "next-auth/providers";

export default NextAuth({
    providers:[
        Providers.Cognito({
            clientId:process.env.COGNITO_CLIENT,
            clientSecret:process.env.COGNITO_CLIENT_SECRET,
            domain: process.env.COGNITO_DOMAIN
        })

        
    ]
})

Answer 1

從技術上講，是的，這是可能的，但@alexrogo 的回答具有誤導性。 Amplify 除了備受質疑（只需查看 github 上的開放票證）之外，不使用 OpenIDConnect 標准。 它正在執行直接 Cognito initiateAuth 操作，該操作返回沒有 openid scope 的令牌。如果您嘗試在 Cognito 上調用例如 /userinfo 端點，那將會失敗。 此外，Amplify 會將令牌保存在本地存儲或 cookies 中，具體取決於您如何配置它，但它不是 httponly cookie ......這非常麻煩。

但話雖如此，可以替換 HostedUI 但要注意，因為 HostedUI 不僅僅是一個 UI。 這是一個完整的授權服務器。 如果您想省略其登錄頁面，則必須自己實現這些功能：請參閱此處了解更多詳細信息： AWS Cognito 授權代碼授權流程，無需使用托管 UI

Answer 2

是的，這是可能的。

您可以將自己的 UI 組件連接到 Cogntio 的 API。 您可以將身份驗證令牌存儲在 state 或本地存儲中。 看看這個文檔。

在那里您會找到所有必需的 function，包括注冊、登錄、注銷、更改用戶屬性、刷新令牌。

Answer 3

只是為了跟進@alexrogo Amplify 有一個完整的內置 UI 連接組件系統，因此您不必自己構建自定義 UI。 這是入門指南。

使用 Amplify 設置新用戶池時的默認流程是USER_SRP_AUTH流程。 Cognito 托管 UI 具有 OAuth 2.0 聯合和 OpenID Connect 的選項

話雖如此，如果您願意，您可以使用 Amplify UI 設置聯合 OAuth 2.0 帳戶，如此處所示。