Share & Embed Your Agent

Once you have an Agent and a route for it, integration is just a URL:

https://interactive.mirako.ai/r/<ROUTE_ID>

There is no session lifecycle to manage. You don't call an API to start anything before the visitor arrives, and you don't clean anything up when they leave. The Interactive backend is always on — opening the link connects the visitor to your agent, and closing the page ends the conversation.

The Visitor Experience

When someone opens your route link:

  1. The page loads your agent's avatar.
  2. The first conversation for an avatar may take a little longer while the avatar is prepared. The page shows a connecting state during this — it is expected, and later visits are fast.
  3. Once ready, the visitor allows camera and microphone access and starts talking. They can also type instead of speaking.
  4. Closing or leaving the page ends the conversation. Nothing keeps running against your account for that visitor afterwards.

For voice and video conversations, Mirako supplies a synthetic opening turn so the agent can greet the visitor before they speak. Agent Greeting describes that opening. End of Conversation explains how managed agents use the built-in end_interaction tool and custom agents send a protocol request to end a call.

Visitors never need a Mirako account or an API key. Remember that the route link itself is the access credential — see Agent Routes for how to expire and revoke links.

Embed in Your App

Drop the route link into an <iframe> to bring the conversation inside your own product:

html
<iframe
  src="https://interactive.mirako.ai/r/<ROUTE_ID>"
  allow="camera; microphone"
  allowfullscreen
  style="width: 100%; height: 640px; border: 0;"
></iframe>

The allow="camera; microphone" attribute is required — without it, the browser will block the visitor's media devices and the avatar will not be able to hear or see them.

You can also simply link or redirect to the route URL from a button, an email, a QR code, or anywhere else a URL can go.

Pass End-User Metadata

If your application knows the visitor (a user id, a name, an account plan), you can pass those facts to the agent. Send them to the embedded page with postMessage:

js
iframe.contentWindow.postMessage(
  {
    type: 'mirako:user',
    user: {
      id: 'cust-8821',
      display_name: 'John',
      locale: 'en-US',
      time_zone: 'America/New_York',
      plan: 'premier'
    }
  },
  'https://interactive.mirako.ai'
);

Send to the exact client origin, not '*'. Send before the conversation starts and the data reaches the opening greeting, so the agent can greet the visitor by name. Send again whenever the facts change, for example after sign-in; the update takes effect on the next turn. Send { type: 'mirako:user', user: null } to clear the snapshot.

The well-known keys are id, display_name, locale, and time_zone. Any other keys are yours and reach the agent unchanged. The whole snapshot is limited to 8 KB. The snapshot travels with every agent turn, managed and custom alike. Custom agents read it in the turn metadata (see End-User Metadata).

Your application asserts this data and Mirako forwards it unverified. It helps the agent personalize the conversation. It is not an identity proof, and the agent must not make account or access decisions from it.

Give Each Visitor Their Own Conversation

Normally, the page gives each browser a sticky conversation automatically, so a returning visitor continues in their own context. If your application wants to control the conversation identity itself — one per logged-in user, per support ticket, or per page — pass your own sessionId:

https://interactive.mirako.ai/r/<ROUTE_ID>?sessionId=<YOUR_SESSION_ID>

Use a stable ID when the same person should resume the same conversation, and a fresh ID when a new conversation should start. Changing the iframe src to a URL with a different sessionId switches the conversation. Pick IDs that are unique per visitor and hard to guess, for example a server-generated UUID mapped from your own user session.

Updating a Live Integration

Because routes point at agents — not at frozen configurations — day-to-day changes need no integration work:

  • New instruction, avatar, or voice? Update the agent. Every route starts using it from the next conversation.
  • Link shared in the wrong place? Revoke that route and create a fresh one. Only the revoked link breaks.
  • Limited-time campaign? Create the route with an expiry up front, for example mirako agent routes create <AGENT_ID> --label "Launch week" --valid-for 168h, and it switches itself off on schedule.

Going Next

  • Agent Routes: Create, expire, and revoke your links
  • MCP Tools: Give a managed agent live tools to call during conversations
  • Agent Link: Connect a custom agent over a held WebSocket instead of an HTTP endpoint (custom integration)

Dive Deeper