How do I create a Cognito Identity with Facebook token - facebook-javascript-sdk

I have followed through all the steps in the documentation, user pool for registration through an email/pwd combo (working), configured FB identity provider in both the identity pool and user pool section for identity providers, and implemented the following code example found here http://docs.aws.amazon.com/cognito/latest/developerguide/facebook.html and modified below using my identity pool.
{code}
function facebookLogin(){
FB.login(function (response) {
// Check if the user logged in successfully.
if (response.authResponse) {
console.log('You are now logged in.' + response.authResponse.accessToken);
// Add the Facebook access token to the Cognito credentials login map.
AWS.config.credentials = new AWS.CognitoIdentityCredentials({
IdentityPoolId: 'us-east-1:eb997110-50b3-4e40-97ff-fbaf796da9ef',
Logins: {
'graph.facebook.com': response.authResponse.accessToken // cognitouser.idToken
}
});
console.log('Added FB access token to Cognito.');
// Obtain AWS credentials
AWS.config.credentials.get(function(){
//getCurrentUser();
console.log('Got the aws creds.');
});
} else {
console.log('There was a problem logging you in.');
}
});
}
{code}
I can step through and see the FB token being passed into CognitoIdentityCredentials and there are no errors but a user never gets registered in either my Identity Pool or User Pool.
Am I missing something?

Here is a sample of the code I use for creating Federated Identities in AWS
function loadCredentials(identityPool, provider, accessToken) {
var params = {
/*AccountId: window.appInfo.accountId,*/
//RoleArn: window.ap
IdentityPoolId: identityPool,
Logins: {}
};
params.Logins[provider] = accessToken;
AWS.config.credentials = new AWS.CognitoIdentityCredentials(params);
AWS.config.credentials.get(function (err) {
if (err) {
console.log(err.message);
console.log(err.stack);
}
else
{
console.log("Cognito Identity Id: " + AWS.config.credentials.identityId);
console.log("Worked");
}
});
}

Related

auth0 checkSession({}) returns login_required when logged in through social provider, but not when logging in via username/password

I have an Angular app that uses Auth0 for authentication, and I'm trying to use checkSession({}, …) to persist a user's session if the token hasn't expired yet.
When I log in with my username/pw that I set up for the site, this works fine when I reload the browser/navigate directly to a resource. However, when I log in using a social provider (such as Google), the checkSession({}, …) call on a page reload returns an error and forces the user to log in again.
Some of the relevant code (mostly from the auth0 tutorial(s)):
export class AuthService {
// Create Auth0 web auth instance
private _auth0 = new auth0.WebAuth({
clientID: AUTH_CONFIG.CLIENT_ID,
domain: AUTH_CONFIG.CLIENT_DOMAIN,
responseType: 'token',
redirectUri: AUTH_CONFIG.REDIRECT,
audience: AUTH_CONFIG.AUDIENCE,
scope: AUTH_CONFIG.SCOPE
});
accessToken: string;
userProfile: any;
expiresAt: number;
// Create a stream of logged in status to communicate throughout app
loggedIn: boolean;
loggedIn$ = new BehaviorSubject<boolean>(this.loggedIn);
loggingIn: boolean;
isAdmin: boolean;
// Subscribe to token expiration stream
refreshSub: Subscription;
constructor(private router: Router) {
// If app auth token is not expired, request new token
if (JSON.parse(localStorage.getItem('expires_at')) > Date.now()) {
this.renewToken();
}
}
...
handleAuth() {
// When Auth0 hash parsed, get profile
this._auth0.parseHash((err, authResult) => {
if (authResult && authResult.accessToken) {
window.location.hash = '';
this._getProfile(authResult);
} else if (err) {
this._clearRedirect();
this.router.navigate(['/']);
console.error(`Error authenticating: ${err.error}`);
}
this.router.navigate(['/']);
});
}
private _getProfile(authResult) {
this.loggingIn = true;
// Use access token to retrieve user's profile and set session
this._auth0.client.userInfo(authResult.accessToken, (err, profile) => {
if (profile) {
this._setSession(authResult, profile);
this._redirect();
} else if (err) {
console.warn(`Error retrieving profile: ${err.error}`);
}
});
}
private _setSession(authResult, profile?) {
this.expiresAt = (authResult.expiresIn * 1000) + Date.now();
// Store expiration in local storage to access in constructor
localStorage.setItem('expires_at', JSON.stringify(this.expiresAt));
this.accessToken = authResult.accessToken;
this.userProfile = profile;
if (profile) {
this.isAdmin = this._checkAdmin(profile);
}
...
}
...
get tokenValid(): boolean {
// Check if current time is past access token's expiration
return Date.now() < JSON.parse(localStorage.getItem('expires_at'));
}
renewToken() {
// Check for valid Auth0 session
this._auth0.checkSession({}, (err, authResult) => {
if (authResult && authResult.accessToken) {
this._getProfile(authResult);
} else {
this._clearExpiration();
}
});
}
}
(This is from a service that is called in many places within the app, including some route guards and within some components that rely on profile information. If more of the app code would be useful, I can provide it.)
Also note: AUTH_CONFIG.SCOPE = 'openid profile email'
So, the issue appears to not have been related to my app at all. When using Social Providers, Auth0 has an explicit note in one of their tutorials that really helped me out:
The issue with social providers is that they were incorrectly configured in my Auth0 dashboard, and needed to use provider-specific app keys.
Important Note: If you are using Auth0 social connections in your app,
please make sure that you have set the connections up to use your own
client app keys. If you're using Auth0 dev keys, token renewal will
always return login_required. Each social connection's details has a
link with explicit instructions on how to acquire your own key for the
particular IdP.
Comment was found on this page: https://auth0.com/blog/real-world-angular-series-part-7/

How to invoke azure b2c signup using MSAL in a SPA

I am looking to invoke a popup from a SPA to the Azure B2C signup page.
From one of the sample applications a login popup can be invoked, but how would I open directly to a signup page?
function login() {
clientApplication.loginPopup(applicationConfig.b2cScopes, "login_hint=foo#bar.com").then(function (idToken) {
clientApplication.acquireTokenSilent(applicationConfig.b2cScopes).then(function (accessToken) {
updateUI();
}, function (error) {
clientApplication.acquireTokenPopup(applicationConfig.b2cScopes).then(function (accessToken) {
updateUI();
}, function (error) {
logMessage("Error acquiring the popup:\n" + error);
});
})
}, function (error) {
logMessage("Error during login:\n" + error);
});
}
I found you can invoke the popup using a Signup policy instead of a Login policy and it will open the signup screen.
Set the authority with policy = signup policy name
authority: "https://login.microsoftonline.com/tfp/xxxxtenant.onmicrosoft.com/" + policy,
...
var clientApplication = new Msal.UserAgentApplication(applicationConfig.clientID, applicationConfig.authority, function (errorDesc, token, error, tokenType) {
// Called after loginRedirect or acquireTokenPopup
});

AWS cognito: Auto login after registration confirmation

I am using the JavaScript SDK of AWS Cognito (http://docs.aws.amazon.com/cognito/latest/developerguide/using-amazon-cognito-user-identity-pools-javascript-examples.html).
When a new user completes registration confirmation, the documentation says the user is now ready to sign in. Is it possible to automatically sign in the user at this time?
For eg., after confirmation when I use the following I get null:
userPool.getCurrentUser();
If this is the intended behavior, are there any ways to sign in the user without explicitly asking the user again?
I know this is not a good idea, one thing I can think of is to save the user credentials in local storage and use them after confirmation to automatically sign in. Any other ideas better than this?
Upon user signup, your backend will be receiving users credentials, which you can use to generate the JWT token. Then you can add the JWT token in the same response, which can be use by the browser client to request authorized endpoints.
Example:
AWSCognito.config.region = 'us-east-1'; //This is required to derive the endpoint
var poolData = {
UserPoolId: 'us-east-1_TcoKGbf7n',
ClientId: '4pe2usejqcdmhi0a25jp4b5sh3'
};
var userPool = new AWSCognito.CognitoIdentityServiceProvider.CognitoUserPool(poolData);
var attributeList = [];
var dataEmail = {
Name: 'email',
Value: 'email#mydomain.com'
};
var authenticationData = {
Username: 'username',
Password: 'password',
};
var attributeEmail = new AWSCognito.CognitoIdentityServiceProvider.CognitoUserAttribute(dataEmail);
attributeList.push(attributeEmail);
userPool.signUp(authenticationData.Username, authenticationData.Password, attributeList, null, function (err, result) {
if (err) {
alert(err);
return;
}
var authenticationDetails = new AWSCognito.CognitoIdentityServiceProvider.AuthenticationDetails(authenticationData);
var userData = {
Username: authenticationData.Username,
Pool: userPool
};
var cognitoUser = new AWSCognito.CognitoIdentityServiceProvider.CognitoUser(userData);
cognitoUser.authenticateUser(authenticationDetails, {
onSuccess: function (result) {
console.log('access token + ' + result.getAccessToken().getJwtToken());
/*Use the idToken for Logins Map when Federating User Pools with Cognito Identity or when passing through an Authorization Header to an API Gateway Authorizer*/
console.log('idToken + ' + result.idToken.jwtToken);
/*Return the result.idToken.jwtToken with the response*/
},
onFailure: function (err) {
alert(err);
},
});
});

Access Youtube Channel ID once signed in though Firebase GoogleAuthProvider

I've setup a basic Firebase authentication app which uses Google. I've passed the following scopes:
https://www.googleapis.com/auth/youtube.force-ssl
When logging in, it states that it is gaining permission to manage my Youtube Account, but the response I get back has nothing relevant to Youtube in it, such as a channelId.
Even when doing a simple $http.get request against the logged in accounts Youtube subscriptions I get the following response:
The request uses the <code>mine</code> parameter but is not properly authorized.
So would I need to login through Google, then authenticate again once signed in to access my Youtube account?
Sample login:
var provider = new firebase.auth.GoogleAuthProvider();
provider.addScope("https://www.googleapis.com/auth/youtube.force-ssl");
$scope.login = function () {
Auth.$signInWithPopup(provider).then(function (result) {
console.log(result);
console.log("Signed in as:", result.user.uid);
}).catch(function (error) {
console.error("Authentication failed:", error);
});
}
Apologies in the delay.
Here is how I solved this problem. When logging in using Firebase with Google as a provider, I get the access_token given by Google and query YouTubes API to get the correct channel.
An example of my login function is below:
this.loginMainGoogle = function (event) {
gapi.auth2.getAuthInstance().signIn().then(function _firebaseSignIn(googleUser) {
var unsubscribe = $rootScope.authObj.$onAuthStateChanged(function (firebaseUser) {
unsubscribe();
// Check if we are already signed-in Firebase with the correct user.
if (!_isUserEqual(googleUser, firebaseUser)) {
// Build Firebase credential with the Google ID token.
console.log(googleUser.getAuthResponse());
var credential = firebase.auth.GoogleAuthProvider.credential(
googleUser.getAuthResponse().id_token);
// Sign in with credential from the Google user.
return $rootScope.authObj.$signInWithCredential(credential)
.then(function (result) {
var ytToken = googleUser.getAuthResponse().access_token;
localStorage.setItem('gToken', ytToken);
$rootScope.tokenerino = ytToken;
$http.get("https://www.googleapis.com/youtube/v3/channels?part=id&mine=true&access_token=" + ytToken)
.then(function(response) {
$rootScope.myChan = response.data.items[0].id;
localStorage.setItem('myChannelId', $rootScope.myChan);
updateYTChannel(result.uid, response.data.items[0].id);
});
$rootScope.currentLoginStatus = true;
$rootScope.notification("You Have Signed In");
//Don't redirect them if they login via a YouTube playlist
if ($location.path().indexOf('playlists') !== 1) {
$state.go('mymusic');
}
}, function errorCallback(error) {
console.log(error);
});
}
})
});
}
I store the Channel for the user in Firebase, but you can put it in localStorage if you want. The only problem is that the access_token only lasts for 1 hour. Hopefully this helps anyone and if a better solution has been found - feel free to share!

AWS Cognito Authentication via Facebook succeeds but getCurrentUser returns null

In the browser, after Facebook Login, statusChangeCallback is called. Everything succeeds. Cognito even returns an Identity Id. However, userPool.getCurrentUser() returns null. Cognito does not think there is an authenticated user. How can I fix that? Thanks.
function statusChangeCallback(response) {
if(response.status == 'connected' && response.authResponse) {
testAPI()
console.log("FB statusChangeCallback", JSON.stringify(response))
AWSCognito.config.credentials = new AWSCognito.CognitoIdentityCredentials({
IdentityPoolId : '<%=process.env.AWS_USERPOOLGUID%>', // your identity pool id here
Logins : {
'graph.facebook.com': response.authResponse.accessToken
}
});
console.log(JSON.stringify(AWSCognito.config.credentials))
AWSCognito.config.region = '<%= process.env.AWS_REGION%>'
AWSCognito.config.credentials.refresh(function(error) {
if (error) {
console.error("AWSCognito.config.credentials.get", error);
} else {
console.log("Cognito Identity Id", AWSCognito.config.credentials.identityId);
console.log('Successfully logged!');
var cognitoUser = userPool.getCurrentUser();
console.log('cognitoUser', cognitoUser);
}
});
}
}
userPool.getCurrentUser();
refers to the authenticated user with regards to the particular user pool. What you are doing, in the above code is obtaining AWS credentials using a Facebook identity. However, the current user refers to the last authenticated user of the user pool. That is saved in local storage after a successful authentication. So you would need to authenticate first, similar to the code below.
var authenticationData = {
Username : 'username',
Password : 'password',
};
var authenticationDetails = new AWSCognito.CognitoIdentityServiceProvider.AuthenticationDetails(authenticationData);
var poolData = {
UserPoolId : '...', // Your user pool id here
ClientId : '...' // Your client id here
};
var userPool = new AWSCognito.CognitoIdentityServiceProvider.CognitoUserPool(poolData);
var userData = {
Username : 'username',
Pool : userPool
};
var cognitoUser = new AWSCognito.CognitoIdentityServiceProvider.CognitoUser(userData);
cognitoUser.authenticateUser(authenticationDetails, {
onSuccess: function (result) {
console.log('access token + ' + result.getAccessToken().getJwtToken());
AWS.config.credentials = new AWS.CognitoIdentityCredentials({
IdentityPoolId : '...', // your identity pool id here
Logins : {
// Change the key below according to the specific region your user pool is in.
'cognito-idp.<region>.amazonaws.com/<YOUR_USER_POOL_ID>' : result.getIdToken().getJwtToken()
}
});
// Instantiate aws sdk service objects now that the credentials have been updated.
// example: var s3 = new AWS.S3();
},
onFailure: function(err) {
alert(err);
},
});
Looks like you need to change your AWSCognito.config.credentials
From what you have to this:
// Add the Facebook access token to the Cognito credentials login map.
AWS.config.credentials = new AWS.CognitoIdentityCredentials({
IdentityPoolId: 'IDENTITY_POOL_ID',
Logins: {
'graph.facebook.com': response.authResponse.accessToken
}
});
// Obtain AWS credentials
AWS.config.credentials.get(function(){
// Access AWS resources here.
});
NOTICE : IdentityPoolId: 'IDENTITY_POOL_ID', and not IdentityPoolId : '<%=process.env.AWS_USERPOOLGUID%>', // your identity pool id here
Looks like you are trying to access your USER POOL and not your IDENTITY POOL.
Facebook users live in the Identity Pool because they are a federated user from the Facebook server.