Monstral / Developer portal

Developer portal

Everything an engineer needs to put Monstral on a site and connect it to the rest of your stack.

How it fits together

Monstral runs as one script tag on your site. It loads the demo configuration your team approved in the dashboard, shows hover tips, tours and an assistant, and sends anonymous telemetry back. Everything else — crawling, analysis, translations, lead scoring — happens on Monstral's servers.

There are three integration points: the snippet (in the browser), outgoing events (webhooks and Slack) and the REST API (server to server, with service keys).

Install the snippet

Add the tag to the <head> of every page, or through your tag manager. It is loaded async and does nothing until the configuration arrives.

  • checkdata-project — your project ID (shown on the Publish page of the dashboard).
  • checkdata-backend — the Monstral API origin. Required when you serve the script from a CDN.
  • checkdata-lang — optional. Forces the widget language (en, tr, de, fr, es). Without it the widget follows the visitor's browser language.
index.html
<script async
src="https://api.monstral.io/embed/agent-embed.js"
data-backend="https://api.monstral.io"
data-project="YOUR_PROJECT_ID"
data-lang="de" <!-- optional -->
></script>

Content-Security-Policy

If your site sends a CSP header, allow the Monstral API origin in both script-src and connect-src. The widget draws its UI inside a Shadow DOM with a constructed stylesheet, so style-src 'self' is fine. The Publish page's “Verify installation” reads your live CSP and tells you exactly what is missing.

Content-Security-Policy
script-src 'self' https://api.monstral.io;
connect-src 'self' https://api.monstral.io;

Single-page apps and logged-in areas

The snippet follows client-side navigation (History API, Navigation API and hash routers), so you install it once. Pages behind a login work: the crawler signs in with a test user you configure, and the widget runs in your visitor's own session.

Allowed domains and the publish switch

  • checkAllowed domains: when the list is not empty, the assistant only answers chat messages from those origins. Anyone can copy a snippet from your page source — the list stops it from spending your quota elsewhere.
  • checkPublish switch: while the demo is off, the snippet stays installed but renders nothing and records nothing. On-site editing keeps working, so you can install early and go live later.
  • checkEvery page load that fetches the configuration is recorded per origin — that is how “Verify installation” knows the widget really connects.

Editing on the live site

“Edit on site” opens your page with ?da-edit=<code>. The code is single-use, expires in five minutes and is removed from the address bar immediately. The widget exchanges it for a two-hour editing token kept in that tab's sessionStorage. Editing endpoints accept only this token — dashboard cookies never reach your site — and only for one project.

Events, webhooks and Slack

Alert rules send events to connections. A webhook connection receives a JSON POST; a Slack connection receives a formatted message through an Incoming Webhook. Failed deliveries are retried with exponential backoff and given up after five attempts; every delivery is visible in the dashboard with its HTTP status and payload. Use “Send test” to receive a test.ping event on demand.

visitor.hot_lead_qualified
{
"session_id": "3f1c…",
"sicaklik": 5,
"rule": "Hot lead (score ≥ 4)",
"report": {
"ozet": "Compared the Pro and Team plans, asked about SSO",
"ilgi_alanlari": ["SSO", "pricing"],
"sonraki_adim": "Offer a security review call"
}
}

REST API

Machine clients authenticate with a project service key: Authorization: Bearer dak_… . Keys are scoped to one project (or one organization) and have member rights: they can start crawls and read insights, but cannot manage people or keys.

What the widget collects

  • checkPage views, time on page, pauses and clicks on the hotspots your team enabled.
  • checkChat messages the visitor types, and answers to your pre-tour survey.
  • checkContact details only when the visitor gives them in the chat.
  • checkNever form input values, keystrokes outside the chat, or cookies of your site.