Create the back-end for a simple "Sign in with Google" web app
What Is Identity Federation?
Identity federation is a fancy word for using a third-party, like Google or Apple, to sign in to a website. It makes the process of creating an account on a mobile app or website easier and with the right directory management software, can make it easier than creating an in-house solution.
Doesn't it seem as if almost every website under the sun has a Sign in with Google button? Wouldn't it be easier to create your own system to validate users? Well, it turns out that that's not necessarily true. AWS, and I'm sure Azure and Google, have a service called AWS Cognito which is all about making use of federated identities.
The AWS Solution
Cognito allows for identity federation from a host of providers, like Facebook, Google, Twitter, SAML 2.0 compatible, and Cognito user pools. Cognito is also serverless, which means you only get billed for what you use.
How Does Cognito Work?
Users will sign on with an identity provider like Google and Google will send a token that says the user is who they claim they are. This token gets sent to AWS Cognito and will swap the Google token for AWS credentials and allow the user to assume a role.
The Problem
I want to let other people sign on with Google and access a few photos of my dog, Kevin. He's a Shih-Tzu miniature Poodle mix and is absolutely adorable.
The problem is that his photos are locked in an S3 bucket and only people who have authenticated themselves with Google can view these images.
Prerequisites
📍Google Account
📍AWS Account
📍Two S3 Buckets
- one bucket with the web-app html and javascript that's set to be accessible by the public and static-website hosting turned on and a bucket policy that allows for anyone to get the objects from the bucket
- another bucket with the images you want to show the world that has public access blocked but with cross-origin resource sharing enabled for all headers with GET and HEAD methods allowed, from all origins, and exposing headers.
📍CloudFront distribution
- The web-app bucket should be set as the origin
📍IAM policy
- ListBucket & GetObject on the web-app bucket and any objects within
Creating the Google OAuth Token
I thought this was an AWS tutorial?
Since we're going to be using Google as our identity provider, we have to enable some things on the Google side.
Go to the Google Cloud Platform website, sign-in to a Google account, and head to the GCP console.
On the top bar, click the drop down and then click, "New Project."
Give the project a name and click the blue create button.
Make sure drop down lists the project that was just created, then click the navigation menu and navigate to APIs and Services, then click OAuth consent screen.
Since we want to allow anybody to access the sign-in, click External.
Enter your app name, provide a name under user support email, and enter an email under developer email. Then continue past the Scopes, Test users pages, and Summary screens.
Now click Credentials on the side bar and click + Create Credentials and then click OAuth client ID.
Click the drop down and click Web application, enter a name, and then under Authorized JavaScript origins, add the URI of the CloudFront distribution noted in the prerequisites.
This means navigating to AWS -> CloudFront -> Distribution -> Distribution created as prerequisite -> Copy distribution domain name -> Paste into Authorized JavaScript origins.
Make note of your client ID
Wrap Up
This is the end of part one of implementing a simple web identification federation application. The final portion, part two, will be posted either this upcoming Friday/Saturday. Have a great Thanksgiving!
Top comments (0)