Electron
Add OnyxMetric analytics to your Electron app
An Electron renderer is a Chromium page, so OnyxMetric runs in it the same way it does in a browser. Put the script tag in the renderer's HTML and allow the OnyxMetric host in your Content Security Policy.
Copy your tracking snippet
In OnyxMetric, open your site's Site Settings and copy the tracking script. It looks like this:
<script src="https://app.onyxmetric.com/api/script.js?siteId=YOUR_SITE_ID" async></script>YOUR_SITE_ID is the numeric ID of your site.
Add the snippet to Electron
Paste the snippet into the <head> of the renderer HTML, and allow the host in both script-src (the script itself) and connect-src (its requests):
<meta
http-equiv="Content-Security-Policy"
content="default-src 'self'; script-src 'self' https://app.onyxmetric.com; connect-src 'self' https://app.onyxmetric.com"
/>
<script src="https://app.onyxmetric.com/api/script.js?siteId=YOUR_SITE_ID" async></script>If you set the CSP from the main process with session.defaultSession.webRequest.onHeadersReceived, add the same two sources there.
In-app navigation is tracked without extra code. The tracker wraps history.pushState and history.replaceState and listens for popstate and hashchange, so history-mode and hash-mode routers both work.
Check that it works
Load your live site and click through a few pages. Pageviews show up in the OnyxMetric dashboard within seconds.
If nothing arrives:
- View the page source and search for
script.js?siteId=to confirm the tag is present. - In the browser's Network tab, check that
script.jsreturns200and that requests go to/api/track. - Turn off ad blockers, or proxy the script through your own domain.
- Read script troubleshooting for other causes.
Troubleshooting
- Requests blocked on the
file://origin: the tracking endpoints answer CORS preflights forhttp://andhttps://origins only. A renderer opened withwin.loadFile()runs onfile://, so serve the renderer from a localhttp://origin if you need events from it. - CSP violation in the console: the message names the blocked directive. Add
https://app.onyxmetric.comto it.connect-srccovers requests, and the script tag also needsscript-src. - Hostname is empty in the dashboard: pageviews report the renderer's
window.location.hostname, which is empty forfile://pages. Filter by site rather than hostname.
Next steps
- Track custom events such as signups, purchases, and clicks.
- Identify users to tie sessions to accounts.
- Proxy the script through your own domain to get past ad blockers.
- Script attributes let you skip or mask URLs and tag events.