Mixpanelへのデータ送信対象プロジェクトを動的に切り替える

こんにちは、まつおかです。

Mixpanelにデータを取り込む際、意図したデータが取得できているかのテストが必須となりますが、開発時のデータと本番のデータが混在することで正しい指標分析ができなくなること避けるため、開発用と本番用で別のプロジェクトを作成することを推奨しています。
Mixpanelで作成できるプロジェクトの数に制限はありませんので、煩雑にならないように注意が必要ではありますが目的別にプロジェクトを分けることが可能です。

そこで今回は、JavaScriptを使用した場合を例に、ドメインから本番環境かそうでないかを判断してライブラリの初期化時に使用するProject Tokenを切り替える方法をご紹介します。

前提

• 開発環境と本番環境で異なるドメインである
• 開発用、本番用のMixpanelプロジェクトが作成されている

実装方法

ライブラリを初期化（mixpanel.init）している箇所を以下のコードにします。

var productionHost = 'Your production Domain';   // 本番ドメイン
var devToken = 'Development Token';              // 開発トークン
var prodToken = 'Production Token';              // 本番トークン

// ドメイン名が本番ドメインでない場合は開発トークンで初期化、それ以外は本番トークンで初期化
if (window.location.hostname.toLowerCase().search(productionHost) < 0) { 
    mixpanel.init(devToken);
} else { mixpanel.init(prodToken);}

初期化するトークンを動的に変更することで、手動で送信先を変更することなくそれぞれのプロジェクトにデータを送信することができます。

さいごに

環境構築の際にはぜひご活用ください！