Installation
Add @mydle/browser-sdk with a publishable pk_ key, allow your site origin, and confirm POST /api/rum/v1/ingest in the network panel.
Prerequisites#
- A Mydle workspace with
browser_monitoring(Free or paid). - A Browser app and publishable key from Settings → API Keys or /app/browser (
pk_live_…/pk_test_…). - Exact HTTP(S) origins configured on that Browser app (see below).
Install#
npm install @mydle/browser-sdkHosted script installs (CDN / /sdk/mydle-browser.js) call initMydleBrowser from data-* attributes — same ingest contract.
Initialize#
import { mydle } from "@mydle/browser-sdk";
mydle.init({
projectKey: "pk_live_…",
// endpoint defaults to https://www.mydle.app/api/rum/v1/ingest
});Prefer projectKey. Legacy publicKey / initMydleBrowser still work. Options are documented on Browser SDK. SSR-safe: init no-ops when window is unavailable.
Verify#
- Load a page that runs the SDK.
- In DevTools → Network, confirm
POSTto/api/rum/v1/ingest(fetch orsendBeacon). - Refresh /app/browser. Overview should show at least one session / pageview when ingest succeeds.
Origins#
Ingest requires an exact allowed origin on the Browser app. Empty allowlists and wildcard origins are denied. Configure origins in the authenticated Browser app settings before shipping the SDK to production.
Limitations
- Never put workspace REST API keys (
mydle_…) in client bundles. - Typos in
pk_keys fail client-side with a console warning and a no-op SDK. - Free includes 5,000 accepted events per month and Pro 50,000. Over the allowance ingest returns
429 QUOTA_EXCEEDED. Team and Enterprise have no monthly event cap.