This solution is inspired in this AWS Blog post
To understand how all the building blocks work together, let’s look at the scenario of a user who tries to access the SPA but hasn’t authenticated yet.
The following are the three main parts to the solution’s flow:
Part 1: The user attempts to access the SPA and a Lambda@Edge function is invoked that redirects to Cognito for authentication.
Part 2: The user authenticates and is redirected back to CloudFront. CloudFront verifies authentication using a Lambda@Edge function, and then sets cookies with JWTs.
Part 3: The user’s browser follows the redirect and reattempts to access the SPA. Lambda@Edge validates that access is now authorized, by checking the JWTs in the cookies.
- Clone Git Repository
- Copy file
example_config.json
and name it as aconfig.json
- Complete
config.json
with all the necessary information
- Complete
- Execute
npm install
- Execute
npm run build
- Use the generated zip in
/dist/lambda_edge.zip
to create your Lambda@Edge - Assign this Lambda@Edge function to your Cloudfront distribution on the the desired path
- Use the Cloudfront Event
Viewer Request
- It is not necessary to include the body
- Make sure that your Cloudfront behavior is forwarding query string and headers
- Use the Cloudfront Event