本地主机上 Cognito 托管 UI 的 Facebook 登录设置

Question

我正在尝试使用 AWS Cognito 托管的 UI 来允许用户使用 Facebook 登录到用户池。我希望能够在我的本地开发环境中进行身份验证。我的问题是我似乎无法找出正确的 URL 来指定使事情正常工作localhost:3000。

我尝试了很多组合，但我似乎不断收到“无法加载 UL”错误：

在前端，我使用aws-amplify-react的withOAuth函数来利用加载托管 UI 的函数：

import React, {Component} from 'react';
import Amplify from 'aws-amplify';
import { withOAuth } from 'aws-amplify-react';

const oauth = {
    domain: 'my-app-client-domain.auth.us-east-1.amazoncognito.com',
    scope: [
        'phone', 'email', 'profile', 'openid', 'aws.cognito.signin.user.admin'
    ],
    redirectSignIn: 'https://localhost:3000/authenticated',
    redirectSignOut: 'https://localhost:3000/logout',
    responseType: 'code'
}
Amplify.configure({
    Auth: {
        oauth: oauth
    }
});

class LoginButton extends Component {
    render() {
        return (<LoginButtonContainer>
            <LoginButton onPress={this.props.OAuthSignIn}>Log in</LoginButton>
        </LoginButtonContainer>);
    }
}
export default withOAuth(LoginButton);

我的 facebook 应用程序设置在“设置 - > 基本”下如下所示：

应用程序域： my-app-client-domain.auth.us-east-1.amazoncognito.com

网址： https://my-app-client-domain.auth.us-east-1.amazoncognito.com/oauth2/idpresponse

在“产品 -> Facebook 登录 -> 设置”下：

有效的 OAuth 重定向 URI： https://localhost:3000/authenticated

我在 AWS 控制台中的用户池设置是：

在“应用集成 -> 应用客户端设置”下：

显然，我还将应用程序集成域名设置为“my-app-client-domain”，并且我在“Federation -> Identity providers”下设置了我的 facebook 应用程序

所以，总而言之，我目前有以下 URL 设置：

• 前端应用
  • 域：my-app-client-domain.auth.us-east-1.amazoncognito.com
  • 重定向登录：https://localhost:3000/authenticated
  • redirectSignOut : https://localhost:3000/logout
• 脸书设置
  • 应用程序域： my-app-client-domain.auth.us-east-1.amazoncognito.com
  • 网站网址： https : //my-app-client-domain.auth.us-east-1.amazoncognito.com/oauth2/idpresponse
  • 有效的 OAuth 重定向 URI：https://localhost:3000/authenticated
• AWS 用户池设置：
  • 回调 URL： https://my-app-client-domain.auth.us-east-1.amazoncognito.com/oauth2/idpresponse，https://localhost:3000/authenticated
  • 注销 URL： https://my-app-client-domain.auth.us-east-1.amazoncognito.com/oauth2/idpresponse，https://localhost:3000/logout
  • 域前缀： my-app-client-domain

我的任何设置看起来是否有问题，或者是否有一些与我可能设置不正确的实际 URL 无关的内容？

Answer 1

结果不出所料，我的问题完全无关。我在 AWS 中为我​​的身份提供商设置了错误的 Facebook 应用 ID，因此如果您遇到此问题，值得仔细检查。

话虽如此，但缺乏有关设置 Facebook 应用程序以与 Cognito 配合使用的文档使我陷入困境。另外，我也确实需要更新我的 URL 设置，所以以下是最终对我有用的设置：

• 前端应用
  • 域：my-app-client-domain.auth.us-east-1.amazoncognito.com
  • 重定向登录：https://localhost:3000/authenticated
  • redirectSignOut : https://localhost:3000/logout
• 脸书设置
  • 应用程序域：本地主机
  • 网址： https://localhost:3000/
  • 有效的 OAuth 重定向 URI：https : //my-app-client-domain.auth.us-east-1.amazoncognito.com/oauth2/idpresponse
• AWS 用户池设置：
  • 回调 URL(s): https://localhost:3000/authenticated
  • 登出网址： https://localhost:3000/logout
  • 域前缀： my-app-client-domain