Amplify-js: How to handle Oauth returns?

[yuankunluo]

Hi there, my company is working on an enterprise App, which allows our employees to sign in. Our employees are on Office 365 which I have already configured correctly use Cognito User Pool with SAML.

Cognito redirects the user back to my angular app with this url:

http://localhost:4200/authenticated?code=[some authenticate by code grant code flow]

Is there any way to make Amplify aware this successful sign in?
I have tried so many ways including use aws-cognito-auth-js to parse this url, but i can't inject this session into amplify.

Anyone can help? thank you

[jadbox]

I'm also having this issue with the aws Hosted UI oauth page. After login, it redirects back to my app with the Code Grant (also tried Implicit Grant). Amplify seems to make the backend calls to validate the token and succeeds. However all the APIs say that the user is not authenticated.

[jadbox]

@yuankunluo I think there's a fix here https://github.com/aws-amplify/amplify-js/issues/1386

[davegariepy]

+1

[yuankunluo]

@jadbox , thank you , your code solved my problem.

I follow these steps to add Azure AD (Office 365's User Directory) as an Identity Provider to my Cognito User Pool.

https://www.idea11.com.au/how-to-set-up-aws-cognito-federation-office365/

After successfully redirect to my localhost from AWS Cognito, i got the grant code.

The Angular Component i wrote to handle this returns looks like your code: )
`
import { Component, OnInit } from '@angular/core';
import { Router } from '@angular/router';
import { Auth, Hub } from 'aws-amplify';

@Component({
selector: 'app-authenticated-component',
templateUrl: './authenticated-component.component.html',
styleUrls: ['./authenticated-component.component.css']
})
export class AuthenticatedComponentComponent implements OnInit {

constructor(
public router: Router,
) {
console.log('constructor');
Hub.listen('auth', this, 'AuthCodeListener');
}

ngOnInit() {

}

onHubCapsule(capsule: any) {
const { channel, payload } = capsule; // source
if (channel === 'auth' && payload.event === 'signIn') {
Auth.currentAuthenticatedUser().then((data) => {
console.log('---', data) // THIS WORKS for Hosted UI!
// redirect to other page
});
}
}
}

`

Thank you for you help @jadbox , hope the Amplify Doc will have more details about this topic.

[ccius]

hi @yuankunluo
I tried to follow the steps you mentioned in the link https://www.idea11.com.au/how-to-set-up-aws-cognito-federation-office365/
Unfortunately it does not work for me.
Can you please tell me, how did you do it exactly? Did you have to do anything extra apart from those steps?
Thanks in advance

[mahcr]

This issue shouldn't be closed. Even though there is a workaround, it's not a final fix. Instead of listening to the amplify events, all the promises use to check if there is a valid session should be resolved until a sign-in event has been triggered in order to be more accurate.

How to do it? there is a code flow event that is triggered when the hosted UI redirects the user to the app. From there Amplify could know that there is a request on going to get the new tokens.

Use case: In Angular, guards are use to validate rounds, it;s usual that you place your code to check if there is a valid session to make sure that only authenticated user can see those.

[anuradhawick]

Is it possible to initiate the social login protocol on a new tab and listen on Hub for the change of auth state? Thanks in advance