CloudFront Headers Viewer

A simple website displaying user's CloudFront HTTP headers obtained by a CloudFront function.

This project was created to test CloudFront Functions with TypeScript.

Sample results

Architecture

Source: AWS News Blog | Introducing CloudFront Functions – Run Your Code at the Edge with Low Latency at Any Scale

To ensure lowest latency and sub-millisecond execution time, we want to use CloudFront Functions rather than CloudFront Lambda@Edge (CloudFront Functions are executed closest to the user at CloudFront Edge Locations).

Our function will be triggered by a viewer request event to collect CloudFront HTTP headers and redirect the user to display them in the frontend client.