Skip to main content

Proxying Plausible through CloudFront

Step 1: Create new origin

First we need to create a new origin pointing to the Plausible server. In the CloudFront console, under your distribution; create a new origin:

  • Origin Domain Name: plausible.io
  • Origin Protocol Policy: HTTPS Only

Step 2: Create custom behaviours

Now we need to define some custom behaviour for when to use our new origin. In the CloudFront console, under your distribution; create new behaviour.

First for the analytics script:

  • Path Pattern: /js/script.js (you can use /js/script.* to also match script extensions)
  • Turn Off Compress objects automatically
  • Origin or Origin Group: The origin we created in step 1
  • Viewer Protocol Policy: HTTPS Only
  • Allowed HTTP Methods: GET, HEAD
  • Use Legacy cache settings
note

Make sure that the "Origin Request" setting for the script.js is empty.

And another for the event API:

  • Path Pattern: /api/event
  • Origin or Origin Group: The origin we created in step 1
  • Viewer Protocol Policy: HTTPS Only
  • Allowed HTTP Methods: GET, HEAD, OPTIONS, PUT, POST, PATCH, DELETE
  • Origin Request Policy: Managed-UserAgentRefererHeaders

Step 3: Adjust your deployed script

With the custom origin and behaviours in place, you can change your script tag as follows:

<script defer data-domain="yourdomain.com" src="/js/script.js"></script>

Deploy these changes to your CloudFront site. You can verify the proxy is working by opening your network tab. You should see a request to https://yourdomain.com/js/script.js with status 200 and another one to https://yourdomain.com/api/event with status 202.

Using our extensions such as hash-based routing, revenue or outbound link click tracking? Change the file name from script.js to the script you want to use: script.hash.js, script.revenue.js or script.outbound-links.js. Want to use more than one extension? You can chain them like this: script.hash.revenue.outbound-links.js.

Thanks to @thomasjsn for contributing these instructions!