aws-amplify 内置方式重定向到 reactjs 应用程序中的 Microsoft 登录页面

Question

注意：我不想使用 AWS Cognito 服务的内置 hostedUI 页面。

我有自己的自定义登录页面，我已经通过提供另外两个名为Google Login Facebook Login的按钮集成了google和facebook登录。

单击Google Login按钮时，它会直接（从我的自定义登录页面）打开带有以下代码的 google 登录页面，

const googleLogin = async () => {

    Auth.federatedSignIn({ provider: CognitoHostedUIIdentityProvider.Google }).then(cred => {
      ...
    }).catch(e => {
      ...
    });

}

和facebook的相同类型的实现： provider: { provider: CognitoHostedUIIdentityProvider.Facebook}它会将我重定向到 facebook 登录页面。

现在，我想将Auzre-Ad login集成到我的登录页面。 所以又添加了一个按钮Microsoft Azure Login

const microsofAzureLogin = async () => {

        Auth.federatedSignIn({ /* **What should I add here** */ }).then(cred => {
          ...
        }).catch(e => {
          ...
        });

}

我应该在上面的代码中添加什么，以便当单击Microsoft Azure Login按钮时，它会将我重定向到

Answer 1

它应该是您在 Cognito for Microsoft 中作为 OIDC 提供商提供的名称。

这是在本文档中提到的，在identity_provider参数下。

添加此参数以绕过托管 UI 并将您的用户重定向到提供商登录页面。 identity_provider 参数的值是身份提供者 (IdP) 的名称，因为它出现在您的用户池中。

---

    const azureLogin = () => {
        window.location.href = `https://${process.env.COGNITO_DOMAIN}/oauth2/authorize?
        identity_provider=${process.env.IDENTITY_PROVIDER_NAME}
        &redirect_uri=${process.env.COGNITO_REDIRECT_SIGNIN}
        &response_type=CODE
        &client_id=${process.env.COGNITO_APP_CLIENT_ID}
        &scope=${process.env.COGNITO_SCOPE}`;
      }