Setting up AWS CloudFront as a reverse proxy

Note: If you are using the EU cloud then use eu instead of us in all domains (e.g. us.i.posthog.com -> eu.i.posthog.com)

CloudFront can be used as a reverse proxy. Although there are multiple other options if you're using AWS.

By default, CloudFront doesn't forward headers, cookies, or query parameters received from the origin that PostHog uses. To set these up, you need an "origin request policy" as in the instructions below.

Create a distribution

1. On the AWS dashboard, search for CloudFront, then create a new CloudFront distribution
2. Set the origin domain to your PostHog instance us.i.posthog.com or eu.i.posthog.com for PostHog Cloud).
3. Select HTTPS only.
4. Under Default cache behavior, go to Viewer. “Under Allowed HTTP methods,” select “GET, HEAD, OPTIONS, PUT, POST, PATCH, DELETE,” and check OPTIONS under “Cache HTTP methods.” This allows all HTTP methods.
5. Under Cache policy, click “Create policy.” On the “Create cache policy” page:
   1. Name your policy “origin-cors.”
   2. Scroll to “Cache key settings,” click the dropdown for “Headers” that says “Include the following headers,” select Origin and Authorization.
   3. Under “Query strings,” select “All.”
   4. Click “Create” at bottom of the page.

6. Back on the “Create distribution” page, select your “origin-cors” cache policy.
7. Under “Origin request policy,” choose “CORS-CustomOrigin.”
8. Under “Response headers policy,” choose “CORS-with-preflight-and-SecurityHeadersPolicy.”
9. Do not enable AWS Web Application Firewall (WAF).
10. Click “Create distribution” at bottom of the page.
11. Edit the Cloudfront Distribution and add the assets origin us-assets.i.posthog.com or eu-assets.i.posthog.com.
12. Add another behavior the path will be /static/*.
13. Under "Origin,", choose the one created above.
14. Under “cache policy,” choose “origin-cors”
15. Under “Origin request policy,” choose “CORS-CustomOrigin.”
16. Under “Response headers policy,” choose “CORS-with-preflight-and-SecurityHeadersPolicy.”

Once created, copy the distribution domain name, and set it as your API host in your PostHog initialization like this:

posthog.init('<ph_project_api_key>',
  {
    api_host: 'https://<distribution_domain_name>.cloudfront.net',
    ui_host: 'https://us.posthog.com' // or 'https://eu.posthog.com' if your PostHog is hosted in Europe
  }
)

You can find out about CloudFront pricing on the AWS website.

Setup video