'How to use Amplify for implicit federated oauth w/ cognito *without* hosted UI
(Due to the confusion with what is amplify I'm borrowing the below from another post)
- I want to use the feature federation of a user pool NOT an identity pool
- I do NOT want to use this feature with the hosted UI.
- I do NOT want to use this feature with identity pool.
- I do NOT want to use this with the amplify CLI or amplify aws service
I am using aws-amplify
https://www.npmjs.com/package/aws-amplify and the UI elements from @aws-amplify/ui-react
and @aws-amplify/ui-components
.
I am using v1.2.26
of the @aws-amplify/ui-react
The webapp is a react app that runs on our own backend in elastic beanstalk.
We have a web application that uses cognito user pools and user/password to authenticate into our application and we would like to add the ability to use SSO starting off with Google
and eventually implementing other SAML
idp's.
Our ideal flow is for a user to click "Sign in with google" on our page and be immediately taken to a google login screen that once authenticated brings them into the application with a refresh token
so that their user session can be persisted.
Currently getting the error No Cognito Federated Identity pool provided
Is there a way to do this or should we implement the auth flow manually? Amplify seems to be a mess unless you use it exactly as they want with the hosted UI and underlying amplify service.
// Amplify Configuration
import { Amplify } from 'aws-amplify';
useEffect(() => {
//Helpful for debugging
Hub.listen(/.*/, info => console.debug(info));
}, []);
Amplify.configure({
Auth: {
region: pool.region,
userPoolId: pool.id,
userPoolWebClientId: pool.client,
storage: window.sessionStorage,
mandatorySignIn: false,
},
oauth: {
domain: `myCognitoUserPoolTest.${pool.region}.amazoncognito.com`,
//We don't have a sign-in or sign-out URL because its handled by Cognito right now
redirectSignIn: 'http://localhost:3000',
redirectSignOut: 'http://localhost:3000',
// This is the default don't need it explicitly set
// Setting this to "token" only returns a short-lived access token not a refresh token
// responseType: 'code',
},
});
return (<AmplifyAuthenticator
federated={{
googleClientId:'myGoogleClientID',
//Put this in here to just to see
oauthConfig: {
domain: '-domain-.auth.-region-.amazoncognito.com',
//We don't have a sign-in or sign-out URL because its handled by Cognito right now
redirectSignIn: 'http://localhost:3000',
redirectSignOut: 'http://localhost:3000',
scope: ['email', 'profile', 'openid'],
},
}}
>
<AmplifyGoogleButton
slot="federated-buttons"
clientId="myGoogleClientID"
//Tried calling this explicitly, same result.
onClick={() =>
Auth.federatedSignIn({
provider: CognitoHostedUIIdentityProvider.Google,
}).then(res => alert(res))
}
/>
</AmplifyAuthenticator>);
Sources
This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.
Source: Stack Overflow
Solution | Source |
---|