How to Integrate Cognito with Social Sign-in

by Ryan Bui, Javascript Developer

If you want to manually integrate social sign-in using Cognito for your app, you’ve come to the right place! I couldn’t integrate social sign-in with what Cognito offers. This was because the front-end couldn’t integrate with Amplify or Cognito user-pools easily due to their use of Flutter. Flutter is currently too young to integrate with those services.

I also didn’t want to create an identity pool to grant temporary AWS credentials to the front-end. To solve this problem, we enabled an /auth endpoint that will signup/login to Cognito programmatically. The users will in turn get auth tokens.

The users must send their own social tokens from Google, Facebook, or Apple. The validation of those tokens will be done from the back-end.

Signup

What we need is to use the “CognitoIdentityServiceProvider” library and provide necessary credentials and the attributes that we want to assign to the user (email, name, etc). Those attributes have to be required when the pool is created (example below).

In return, we need the userID we just created.

Login

Upon login, we need to provide the username and password. If you want, you can login using the email only. when successful, we need the idToken that will be used later when authorizing user calls to our API.

Authorizing incoming requests

There are two ways to configure authorizers. If we do it manually, we have to open AWS console and head to API Gateway service and create an authorizer in our API.

Next step, give a name to the authorizer and select the Cognito user pool you want. Select a method where you want to use an authorizer and click on ‘Method Request’ to link this method to the authorizer.

First, in authorization, select the authorizer. For OAuth scopes, select “NONE” to expect ID Tokens. If you want to use access tokens with scopes, you can follow the documentation in AWS.

So that’s all you need to do for manual configuration! If you want to automate it with serverless, here’s how you can do it:

Here we just need to provide the ARN of the user pool. We don’t want to cache tokens, which is why we use resultTtlInSeconds: 0. As an identity source, put the path to the authorization header.

Now the consumer of this API just needs to pass the Cognito ID token in the authorization header.

A quick recap…

Cognito doesn’t integrate well with Flutter. We used the AWS SDK to signup and login. By doing so we can generate tokens that we will pass back to the client. Those tokens are used to validate against authorizers in the API gateway.

Special thanks to Serguey Arellano Martínez for co-authoring this article. Check out his tutorials on:
How to Configure AWS on Route 53 & How to Proxy an S3 Static Website

Have questions about integrating Cognito with social sign-in? Click here to speak to one of our experts.

Ryan is a Javascript Developer who has worked closely with TDD and BDD. He enjoys playing video games and guitar.

TribalScale is a global innovation firm that helps enterprises adapt and thrive in the digital era. We transform teams and processes, build best-in-class digital products, and create disruptive startups. Learn more about us on our website. Connect with us on Twitter, LinkedIn & Facebook!