AWS Amplify federated Okta authentication with hosted Cognito UI

Viewed 1897

I'm trying update an existing React Amplify app which authenticates using AWS Cognito user pools to also authenticate using Okta SSO integrated via SAML. Cognito was configured according to these instructions and I'm pretty sure everything is configured correctly, because when I use the "Launch Hosted UI" button from the Cognito console, I see the correct login dialog with both Okta and Cognito username/password panels and can authenticate using either.

I can't get the same panel to display when invoked using the Authenticator component in React though and I think it's because I don't have the federated parameter set correctly, but the only documentation I can find is for configuring with Google, Facebook, or Auth0, not Okta.

The error that I'm getting is:

Unhandled Rejection (TypeError): Cannot read property 'oauthSignIn' of undefined

and the code is set up as follows (but I've tried MANY permutations without luck):

const federatedInfo = {
    oauth_config: {
        domain: 'xxx.auth.us-east-1.amazoncognito.com',
        clientID: 'zzz',
        redirectUri: 'http://localhost:3000/',
        audience: 'urn:amazon:cognito:sp:us-east-yyy',
        responseType: 'token', //'token id_token', // for now we only support implicit grant flow
        scope: 'openid email',
        returnTo: 'http://localhost:3000/'
    }
};


   <Authenticator
        {...props}
        theme={AmplifyTheme}
        federated={federatedInfo}
        hideDefault={true}
        signUpConfig={authConfig.signUpConfig}
        onStateChange={(state, data) => {
            setAuthData({authState: state, user: data});
        }}
        children={[<Greetings/>, <SignIn federated={federatedInfo}/>, <ConfirmSignIn/>, <VerifyContact/>, <ForgotPassword/>, <RequireNewPassword/>]}
    />;

Any hints on how to get this to work?

2 Answers

I don't entirely follow you because I don't use Amplify, but worth checking whether you know you can use the authorize endpoint?

https://docs.aws.amazon.com/cognito/latest/developerguide/authorization-endpoint.html

i.e. you can create a static link with this format

https://[your cognito auth domain]/oauth2/authorize?redirect_uri=[your callback url]&response_type=token&client_id=[your client id]&identity_provider=[your identity provider]

We ended up hacking around this by calling Auth.federatedSignIn() directly, conditionalized on presence of oath.domain in the Auth config, and only using the Authenticator component for local Cognito username/password login.

Not very elegant, but at least it's working. This whole area is woefully underdocumented by Amazon.

Related