Each week, Mixpanel will release articles from our archives to help you get the most out of Mixpanel. Follow the Topic Tag #fromthearchive to subscribe to these posts and get alerted when they drop.
While Mixpanel doesn’t specifically have a library for implementation on Chrome Extensions, it is certainly possible to use Mixpanel to track user actions within a Google Chrome Extension. Many customers have successfully integrated using either the JavaScript library or directly via the HTTP API.
JavaScript
Implementing via the JavaScript library has some advantages, namely that it collects several default properties by default that you can use to learn more about your users. You can find full documentation for using the Mixpanel JavaScript library here.
In addition to reviewing the standard JavaScript implementation documentation, a few tips specific to Chrome Extensions:
Paste the Mixpanel JavaScript code snippet and your project's token within the mixpanel.init()function within the <head> tags at the top of the JavaScript file you will be loading within your extension.
Place tracking code in the <body> tags in between <script> tags.
Some users have reported receiving an error similar to the following in the console when implementing with the JavaScript library, which is related to Chrome’s Content Security Policy: "Mixpanel error: 'mixpanel' object not initialized. Ensure you are using the latest version of the Mixpanel JS Library along with the snippet we provide.”
Chrome requires extensions to load remote resources over HTTPS, so to resolve the error and force all XHR requests sent from your Mixpanel implementation to be sent via HTTPS rather than HTTP, make the following addendum to the mixpanel.init() function:
mixpanel.init("your token",{api_host:"https://api.mixpanel.com"})
HTTP
As an alternative to the JavaScript library, use Mixpanel’s HTTP Tracking API with Chrome Extensions to craft and send your own Mixpanel track calls.
