How to Embed Support in a SaaS Product (Without Building It)

You're building a SaaS product. Your users want to talk to your team, share files, track tasks, and hop on a quick call — all from inside your app. You could build that. It would take a year. Or you could embed customer support as a first-class surface using an embeddable workspace.

Step 1 — Register a host app

A host app is your product. Register it once, store the install key server-side as XCOM_INSTALL_KEY. Add your production origins. Full walkthrough in the embed guide.

Step 2 — Mint short-lived tokens

Your backend exchanges the install key for a 5-minute embed JWT per signed-in user. Never ship the install key to the browser.

const { token } = await xcom.mintEmbedToken({
  hostTenantExternalId: workspace.id,
  user: { externalId: user.id, email: user.email, displayName: user.name },
  scope: ["inbox", "tasks"],
});

Step 3 — Mount the surface

One web component, three lines of HTML. Or use the React SDK for a native React embed with typed events.

<script src="https://embed.xcom.app/embed-loader.js"></script>
<cf-inbox token="{{token}}" theme="light" style="height:600px"></cf-inbox>

Step 4 — Pull usage back

The same JWT authorizes read-only endpoints — events, time entries, usage summary — so your billing engine can charge based on real activity. Full contract in the REST API.

Why not build it

Real-time messaging is famously hard. WebSockets, reconnection, presence, offline queues, push notifications on iOS, encrypted file storage, per-tenant isolation — every one of these is a quarter of engineering. Slack Connect spent years on it. So did we. Reuse it.