dimm3r's Blog

Prevent Ad-blockers from blocking Mixpanel [Without Nginx!]

Prevent Ad-blockers from blocking Mixpanel [Without Nginx!]

dimm3r's photo
dimm3r
Jul 22, 2022·

2 min read

Most ad blockers block Mixpanel from sending events to the server. Since the number of people using ad-blockers or privacy-focused browsers is increasing, there is a dedicated post on Mixpanel's website to address this. However, the solutions they provide seemed unnecessary. We can use a reverse proxy and forward Mixpanel events via our domain.

If you are using a reverse proxy like Nginx, you can use this config, and you're good to go. However, if you are not using Nginx or want to use a lightweight solution, you can proceed with the following paragraphs.

Option 1: Using CloudFront

  • Create a CloudFront distribution.

  • Create an origin with the origin domain, https://api.mixpanel.com/, and give it any name.

image.png

  • Don't add any paths for the origin. By doing so, CloudFront will simply forward the path requested by the browser on your proxy domain to the Mixpanel API domain.

  • Create a behavior and set the origin we just added from step #2.

  • Use the default path pattern (*) and allow GET, HEAD, OPTIONS, PUT, POST, PATCH, DELETE methods and save. Otherwise, you will get a generic Key Not Found error while sending data.

image.png

  • In your application, use this new URI instead of the regular api.mixpanel.com

image.png

mixpanel.init (mixpanelToken, { api_host: newURI });

Option 2: Using CloudFlare

  • Add an A record to your CloudFlare domain with IP 127.0.0.1, with the Proxy Status set to "DNS Only".

image.png

  • Navigate to CloudFlare Workers and create a worker service.

image.png

  • Give it an appropriate name - like mixpanel-proxy and proceed to the next step.

  • Now, edit the Worker script and add this script. Credit goes to CorsFlare by Darkseal

  • Navigate back to CloudFlare Workers, select the worker you just created, and go to Triggers tab and add a custom domain from step 1.

image.png

  • Finally, test your CloudFlare by visiting the domain. If all is well, you will be greeted by the Mixpanel API page.

image.png

Just as you are bypassing ad-blocker, I'm doing something else to get your IP and browser information. Now, how do you like being tracked, huh? 😎

Find the ^flag[A-Za-z]$, comment, and DM me on Twitter to get a surprise!

cloudfrontcloudflareReverse Proxymixpanel