How do you allow new user registration and sign up through a third party, like Facebook, using AWS Cognito?

Question

In my Angular/NodeJS app, I'm currently using AWS Cognito to manage my users. It lets users register with their email address, and sign in with their email and password.

I would like to allow users to register and sign in using third parties, like Facebook and Google. That is, by logging into their Facebook account, a user account on Cognito would be created for them, similar to the accounts for any other users.

There is no clear documentation on AWS how to do this. The closest thing I could find is here (code below) but this only covers temporary authentication, and doesn't create a new user account in the user pool.

How can you integrate third party auth with an existing Cognito based app?

button id="login">Login</button>
<div id="fb-root"></div>
<script type="text/javascript">
var s3 = null;
var appId = '1234567890'; // Facebook app ID
var roleArn = 'arn:aws:iam::<AWS_ACCOUNT_ID>:role/<WEB_IDENTITY_ROLE_NAME>';

window.fbAsyncInit = function() {
  // init the FB JS SDK
  FB.init({appId: appId});

  document.getElementById('login').onclick = function() {
    FB.login(function (response) {
      if (response.authResponse) { // logged in
        AWS.config.credentials = new AWS.WebIdentityCredentials({
          RoleArn: roleArn,
          ProviderId: 'graph.facebook.com',
          WebIdentityToken: response.authResponse.accessToken
        });

        s3 = new AWS.S3;

        console.log('You are now logged in.');
      } else {
        console.log('There was a problem logging you in.');
      }
    });
  };
};

// Load the FB JS SDK asynchronously
(function(d, s, id){
   var js, fjs = d.getElementsByTagName(s)[0];
   if (d.getElementById(id)) {return;}
   js = d.createElement(s); js.id = id;
   js.src = "//connect.facebook.net/en_US/all.js";
   fjs.parentNode.insertBefore(js, fjs);
 }(document, 'script', 'facebook-jssdk'));
</script>

Answer 1

You can easily do so by configuring social providers like Facebook, Google etc. directly in your userpool. See this doc on how to do so. Note that you also need to add mappings between Userpool attributes & token claims returned from Idps like Google & Facebook. You can see how to do so here. Note that in order to use Third-party signin, you need to use Cognito Userpool's app integration feature. The easiest way to do so would be to use Cognito Userpool's hosted (built-in) UI. The UI can be accessed by entering your Userpool's domain URL with appropriate parameters (the parameters part is especially important).

AWS provides a Javascript SDK - Amazon Cognito Auth SDK - to use their app integration feature which makes it easier to use third-party IdPs like Google & Facebook. Note that this SDK is a simple Cognito client SDK and is different from core AWS JS SDK & Amazon Cognito Identity SDK. Take a look at the sample & use cases described on the Github page.

If everything is setup correctly, when you login using Google, facebook etc., a new user will be auto-created by Cognito with the info available in the token returned by Google, Facebook etc.