Authenticating user in AWS Cognito User/Identity Pool with Google as identity provider

Question

AWS provides two possible ways of dealing with Cognito:

1. "old one" via amazon-cognito-identity-js (and possibly amazon-cognito-auth-js) and
2. "new one" via aws-amplify (which inlcudes the above one)

After quite a bit of trouble and reverse engineering, I've successfully managed to sign in (receve back CognitoIdentityCredentials) using aws-amplify locally as part of the development effort.

The steps where (bear with me, as these are important for the questions to follow, and also might help someone):

Setup

1. Create a User Pool in Cognito console

2. Create a User Pool App Client in Cognito console

3. Create Google Web App in Google Console

4. Configure Google Web App to point to http://localhost:8080 (my local dev server)

5. Configure User Pool to use Google as an Identity Provider, supplying it with the Google Web App Client ID and Client secret from Google Console

6. Create an Identity Pool in Congnito console and configure it to work with Google as an Identity Provider, supplying Google Web App Client ID there as well

Implementation

1. Configure Amplify.Auth:

Amplify.configure({
    Auth: {
        identityPoolId: ,
        region: ,
        userPoolId: ,
        userPoolWebClientId: 
    }
});

2. Inject Google API script:

const script = document.createElement('script');
script.src = 'https://apis.google.com/js/platform.js';
script.async = true;
script.onload = this.initGapi;
document.body.appendChild(script);

3. Init Google API:

window.gapi.load('auth2', function() {
    window.gapi.auth2.init({
        client_id: ,
        scope: 'profile email openid'
    });
});

4. Allow, on a button click, for a Google user to sing in:

const ga = window.gapi.auth2.getAuthInstance();
const googleUser = await ga.signIn();
const {id_token, expires_at} = googleUser.getAuthResponse();
const profile = googleUser.getBasicProfile();

5. User the profile, id_token, expires_at above to create a Cognito credentials session:

const user = {
    email: profile.getEmail(),
    name: profile.getName()
};

const credentials = await Auth.federatedSignIn(
    'google',
    {token: id_token, expires_at},
    user
);

At this point a CognitoIdentityCredentials object was returned, properly populated, with token and all...

Problem

Unfortunately, aws-amplify adds a whopping 190K to my application webpack bundle (GZIPped, minified, optimized), which made me choke on my coffee.

Question 1

Can this somehow be reduced by a Babel plugin I'm missing (I'm guessing, no, since AWS is apparently still in 1995 and configures everything on a singleton Amplify and Auth objects).

Question 2

Have I made this unnecessarily complicated and there is a much more robust solution?

Question 3 (most important)

Can this be achieved using the "old way" amazon-cognito-identity-js, which is MUCH MUCH smaller?

I couldn't find, among all the (use cases)[https://github.com/aws/aws-amplify/tree/master/packages/amazon-cognito-identity-js/] a use case for social/federated login.

Answer 1

For me, the difference between

import Amplify from 'aws-amplify'

and

import Amplify from '@aws-amplify/core'

is ~500kB optimized and minified.

I think you also want

import Auth from '@aws-amplify/auth'

which adds only a little bit more.

But I agree, the aws-amplify package is really very large and it's not easy to figure out how to use the core components directly (e.g. aws-cognito-identity-js/es and aws-cognito-auth-js/es).

Answer 2

You could try using modularized exports in AWS amplify