Initial commit

mixpanel · Feb 10, 2021 · 41a6f8c · 41a6f8c
commit 41a6f8c
Show file tree

Hide file tree

Showing 4 changed files with 114 additions and 0 deletions.
diff --git a/Dockerfile b/Dockerfile
@@ -0,0 +1,2 @@
+FROM nginx
+COPY nginx.conf /etc/nginx/nginx.conf
diff --git a/README.md b/README.md
@@ -0,0 +1,76 @@
+# Mixpanel Tracking Proxy Server
+An Nginx config to proxy Mixpanel's Ingestion API. This can be used to setup your own servers to load the JS library and proxy tracking requests to Mixpanel.
+For more documentation on the Mixpanel JS library visit https://developer.mixpanel.com/docs/javascript.
+
+## Instructions
+
+#### 1. Deploy the proxy server
+
+   This is just a simple Nginx config and Dockerfile so you can deploy this anywhere you want: your own hardware or the cloud provider of your choice. We've provided a couple of one-click deploys for your convenience.
+   - [Run on Google Cloud](https://deploy.cloud.run)
+   - [Deploy to DigitalOcean](https://cloud.digitalocean.com/apps/new?repo=https://github.com/jbwyme/mixpanel-proxy-test/tree/main)
+
+#### 2. Load the Mixpanel JS library from the proxy domain
+
+   _Note: This is only required if you are NOT bundling the Mixpanel JS library into your source code (via our npm module or otherwise)._
+
+   Add the following variable in your code right before the Mixpanel JS snippet:
+
+   ```js
+   // Set this variable
+   const MIXPANEL_CUSTOM_LIB_URL = "https://<YOUR_PROXY_DOMAIN>/lib.min.js";
+
+   // Before this snippet
+   (function(f,b){if(!b.__SV){var e,g,i,h;window.mixpanel=b;b._i=[];b.init=function(e,f,c){function g(a,d){var b=d.split(".");2==b.length&&(a=a[b[0]],d=b[1]);a[d]=function(){a.push([d].concat(Array.prototype.slice.call(arguments,0)))}}var a=b;"undefined"!==typeof c?a=b[c]=[]:c="mixpanel";a.people=a.people||[];a.toString=function(a){var d="mixpanel";"mixpanel"!==c&&(d+="."+c);a||(d+=" (stub)");return d};a.people.toString=function(){return a.toString(1)+".people (stub)"};i="disable time_event track track_pageview track_links track_forms track_with_groups add_group set_group remove_group register register_once alias unregister identify name_tag set_config reset opt_in_tracking opt_out_tracking has_opted_in_tracking has_opted_out_tracking clear_opt_in_out_tracking start_batch_senders people.set people.set_once people.unset people.increment people.append people.union people.track_charge people.clear_charges people.delete_user people.remove".split(" ");
+for(h=0;h<i.length;h++)g(a,i[h]);var j="set set_once union unset remove delete".split(" ");a.get_group=function(){function b(c){d[c]=function(){call2_args=arguments;call2=[c].concat(Array.prototype.slice.call(call2_args,0));a.push([e,call2])}}for(var d={},e=["get_group"].concat(Array.prototype.slice.call(arguments,0)),c=0;c<j.length;c++)b(j[c]);return d};b._i.push([e,f,c])};b.__SV=1.2;e=f.createElement("script");e.type="text/javascript";e.async=!0;e.src="undefined"!==typeof MIXPANEL_CUSTOM_LIB_URL?
+MIXPANEL_CUSTOM_LIB_URL:"file:"===f.location.protocol&&"//cdn.mxpnl.com/libs/mixpanel-2-latest.min.js".match(/^\/\//)?"https://cdn.mxpnl.com/libs/mixpanel-2-latest.min.js":"//cdn.mxpnl.com/libs/mixpanel-2-latest.min.js";g=f.getElementsByTagName("script")[0];g.parentNode.insertBefore(e,g)}})(document,window.mixpanel||[]);
+   ```
+
+#### 3. Configure the Mixpanel JS client to make requests to your proxy domain
+
+   Take the domain that exposes your proxy server and specify it as the value of the `api_host` config option when you initialize the Mixpanel JS SDK.
+
+   ```js
+   mixpanel.init("<YOUR_PROJECT_TOKEN>", {api_host: "https://<YOUR_PROXY_DOMAIN>"})
+   ```
+
+## Full Example
+```index.html
+<html>
+    <head>
+        <title>Mixpanel Tracking Proxy Demo</title>
+        <script type="text/javascript">
+            /**
+             * Configuration Variables - CHANGE THESE!
+             */
+            const MIXPANEL_PROJECT_TOKEN = YOUR_MIXPANEL_PROJECT_TOKEN // e.g. "67e8bfdec29d84ab2d36ae18c57b8535"
+            const MIXPANEL_PROXY_DOMAIN = YOUR_PROXY_DOMAIN // e.g. "https://proxy-eoca2pin3q-uc.a.run.app"
+            
+            /**
+             * Set the MIXPANEL_CUSTOM_LIB_URL - No need to change this
+             */
+            const MIXPANEL_CUSTOM_LIB_URL = MIXPANEL_PROXY_DOMAIN + "/lib.min.js";
+            
+            /**
+             * Load the Mixpanel JS library asyncronously via the js snippet
+             */
+            (function(f,b){if(!b.__SV){var e,g,i,h;window.mixpanel=b;b._i=[];b.init=function(e,f,c){function g(a,d){var b=d.split(".");2==b.length&&(a=a[b[0]],d=b[1]);a[d]=function(){a.push([d].concat(Array.prototype.slice.call(arguments,0)))}}var a=b;"undefined"!==typeof c?a=b[c]=[]:c="mixpanel";a.people=a.people||[];a.toString=function(a){var d="mixpanel";"mixpanel"!==c&&(d+="."+c);a||(d+=" (stub)");return d};a.people.toString=function(){return a.toString(1)+".people (stub)"};i="disable time_event track track_pageview track_links track_forms track_with_groups add_group set_group remove_group register register_once alias unregister identify name_tag set_config reset opt_in_tracking opt_out_tracking has_opted_in_tracking has_opted_out_tracking clear_opt_in_out_tracking start_batch_senders people.set people.set_once people.unset people.increment people.append people.union people.track_charge people.clear_charges people.delete_user people.remove".split(" ");
+for(h=0;h<i.length;h++)g(a,i[h]);var j="set set_once union unset remove delete".split(" ");a.get_group=function(){function b(c){d[c]=function(){call2_args=arguments;call2=[c].concat(Array.prototype.slice.call(call2_args,0));a.push([e,call2])}}for(var d={},e=["get_group"].concat(Array.prototype.slice.call(arguments,0)),c=0;c<j.length;c++)b(j[c]);return d};b._i.push([e,f,c])};b.__SV=1.2;e=f.createElement("script");e.type="text/javascript";e.async=!0;e.src="undefined"!==typeof MIXPANEL_CUSTOM_LIB_URL?
+MIXPANEL_CUSTOM_LIB_URL:"file:"===f.location.protocol&&"//cdn.mxpnl.com/libs/mixpanel-2-latest.min.js".match(/^\/\//)?"https://cdn.mxpnl.com/libs/mixpanel-2-latest.min.js":"//cdn.mxpnl.com/libs/mixpanel-2-latest.min.js";g=f.getElementsByTagName("script")[0];g.parentNode.insertBefore(e,g)}})(document,window.mixpanel||[]);
+            
+            /**
+             * Initialize a Mixpanel instance using your project token and proxy domain
+             */
+            mixpanel.init(MIXPANEL_PROJECT_TOKEN, {debug: true, api_host: MIXPANEL_PROXY_DOMAIN});
+            
+            /**
+             * Track an event when the page is loaded
+             */
+            mixpanel.track("[Proxy Demo] Page loaded");
+        </script>
+    </head>
+    <body>
+        <button onclick="mixpanel.track('[Proxy Demo] Button clicked')">Track event</button>
+    </body>
+</html>
+```
diff --git a/app.json b/app.json
@@ -0,0 +1,7 @@
+{
+    "name": "proxy",
+    "options": {
+        "allow-unauthenticated": true,
+        "port": 80
+    }
+}
diff --git a/nginx.conf b/nginx.conf
@@ -0,0 +1,29 @@
+events {}
+http {
+    server {
+        listen 80 default backlog=16384;
+        listen [::]:80 default backlog=16384;
+
+	location /lib.min.js {
+            proxy_set_header X-Real-IP $http_x_forwarded_for;
+            proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
+            proxy_set_header X-Forwarded-Host $server_name;
+            proxy_pass https://cdn.mxpnl.com/libs/mixpanel-2-latest.min.js;
+        }
+
+	location /lib.js {
+            proxy_set_header X-Real-IP $http_x_forwarded_for;
+            proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
+            proxy_set_header X-Forwarded-Host $server_name;
+            proxy_pass https://cdn.mxpnl.com/libs/mixpanel-2-latest.js;
+        }
+
+        location / {
+            proxy_set_header Host api.mixpanel.com;
+            proxy_set_header X-Real-IP $http_x_forwarded_for; 
+            proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
+            proxy_set_header X-Forwarded-Host $server_name;
+            proxy_pass https://api.mixpanel.com;
+        }
+    }
+}
Original file line number	Diff line number	Diff line change
		@@ -0,0 +1,2 @@
		FROM nginx
		COPY nginx.conf /etc/nginx/nginx.conf