Question

我正在尝试使用AWS Amplify将OAuth（Facebook）集成到我的应用程序中。问题是使用 withOAuth HOC，我无法打开授权窗口，相反，我被重定向到Hosted UI页面，可以在其中按Login等。

为更好地说明我的问题，假设您正在单击页面上负责对Facebook进行身份验证的按钮，而不是向您显示确认操作的窗口，而是重定向到Hosted UI页面，然后，您可以单击Facebook登录按钮。托管的UI URL如下所示：

https://xxxxx.auth.us-east-1.amazoncognito.com/login?redirect_uri=http://localhost:3000/&response_type=code&client_id=yyyyyyyyy

我尝试直接访问窗口位置，并且可以正常工作。

工作方式

export const urlToFacebook = `https://${ oauth.domain }/oauth2/authorize?identity_provider=Facebook&redirect_uri=${ oauth.redirect_uri }&response_type=${oauth.responseType}&client_id=${ oauth.clientId }&scope=aws.cognito.signin.user.admin email openid profile`;
window.location.href = urlToFacebook;

不起作用的方式

export const oauth = {
  domain: "xxxxxxxx.auth.us-east-1.amazoncognito.com",
  scope: [
    "email",
    "profile",
    "openid",
    "aws.cognito.signin.user.admin"
  ],
  redirectSignIn: "http://localhost:3000/",
  redirectSignOut: "http://localhost:3000/",
  responseType: "code"
};

Auth.configure({ oauth });

（我与OAuth一起使用的组件）

import React from "react";
import { Button, Container, Icon } from "semantic-ui-react";
import { withOAuth } from "aws-amplify-react";

const SocialAuth = (props: any) => {
  return (
    <Container textAlign="center">
      <Button color="facebook" fluid onClick={props.OAuthSignIn}>
        <Icon name="facebook" /> Facebook
      </Button>
    </Container>
  );
};

export default withOAuth(SocialAuth);

托管的UI OAUTH-Facebook窗口未打开

0 个答案: