Magic Links Explained: Zero-Friction Customer Diagnostics

The hardest part of debugging a customer-reported issue isn't fixing it. It's getting enough information to know what to fix. You can't reproduce it, you can't access their environment, and the support ticket contains exactly one useful sentence: "it doesn't work."

The conventional solution — schedule a screen share, ask them to open DevTools, request a HAR export — puts the diagnostic burden on the person least equipped to carry it. Customers aren't engineers. They don't know what you need or how to get it. Every question you send adds a round-trip measured in hours.

Magic links are a different approach. Instead of asking the customer to gather information for you, you give them a link that gathers it automatically — then you review it when you're ready.

What a Magic Link Is

In Clairvio's model, a magic link is a unique, token-based URL generated by your support team. When a customer opens it in their browser, it activates a diagnostic session for their account: a lightweight JavaScript context that captures their console output, network requests, JavaScript errors, and a DOM-based session replay of their browser state.

From the customer's perspective, clicking the link looks like following any other URL. There's no install prompt, no browser extension, no configuration to walk them through. The link works, and then they go reproduce the issue they reported. That's all they need to do.

From the support team's perspective, the session data streams to a live dashboard in real time. The agent can watch the session as it happens, or they can review the complete recording after the customer has finished. Either way, they see exactly what happened — not a description of what happened.

The Technical Mechanism

Under the hood, the magic link contains a session token that identifies both the target workspace and the specific support case. When the customer follows the link, the token is checked against the server, and the diagnostic context is activated in that browser tab.

The session capture component:

Takes an initial snapshot of the current DOM state
Begins capturing incremental DOM mutations using MutationObserver
Records mouse movements, clicks, scrolls, and keyboard interactions (with sensitive fields masked)
Intercepts XMLHttpRequest and fetch calls, logging URLs, methods, and status codes (authentication headers are redacted)
Captures console.log, console.warn, and console.error output
Records unhandled JavaScript exceptions with stack traces
Collects an environment snapshot: browser, OS, screen dimensions, timezone, language

All of this happens over a WebSocket connection to the Clairvio backend, which routes the data to the agent's dashboard. The agent sees a live feed of the session as it unfolds. If the customer navigates away before the agent is watching, the full session is stored for async review.

Why Zero-Friction Matters

The friction of a diagnostic process directly determines whether customers actually complete it. If you ask a frustrated customer to install a browser extension, open DevTools, export a HAR file, and email it to you — most won't. They'll either give up, contact a competitor, or escalate in a way that takes up more of your team's time than the original issue.

A link that does the work automatically removes that barrier. The customer doesn't need technical knowledge to help you debug their problem. They need to click a link and reproduce the issue — things they were already planning to do.

This changes the completion rate for diagnostic sessions significantly. Support teams that implement magic links typically find that a much higher percentage of customers successfully share the diagnostic information needed to resolve their ticket, compared to workflows that require manual steps.

Security Considerations

A token-based diagnostic URL raises reasonable security questions. Here's how the threat model works in practice:

Token scope and lifetime

Each magic link is scoped to a specific workspace and expires after a configurable period. A token cannot be used to access sessions from other organisations or other workspaces within the same organisation. Expired tokens are rejected server-side.

What the customer's browser captures

The diagnostic session captures browser state — DOM, network, console — but operates entirely within the confines of the current tab. It cannot access other browser tabs, local files, the camera or microphone, or system information beyond what the browser exposes to JavaScript.

Sensitive field masking

Password fields are masked before leaving the browser. The Clairvio SDK respects data-clairvio-mask attributes for any other elements you want to exclude. Authorization headers are stripped from network logs before they're sent to the server.

Agent access controls

Only authenticated agents in the organisation that generated the magic link can view the session data. Sessions are not publicly accessible.

A Typical Workflow

Here's what the magic link workflow looks like end-to-end for a support case:

Ticket arrives. A customer reports that the export functionality on their account isn't working. They don't know the error message; it "just doesn't do anything."
Agent generates a magic link. From the Clairvio dashboard, the agent creates a magic link scoped to this customer's workspace.
Agent sends the link. "Hi — to help us investigate, could you click this link and then try the export again? It'll share your browser's diagnostic information with our team so we can see exactly what's happening."
Customer activates the session. The customer clicks the link, returns to the export feature, and clicks the export button. Nothing visible happens on their end; the diagnostic session is running silently.
Agent reviews the session. The agent opens the live session view. They see the export button click, a POST request to the export endpoint, a 422 Unprocessable Entity response, and a console error: "Export range must not exceed 10,000 rows." The customer was trying to export a dataset with 47,000 rows.
Issue resolved. The agent identifies the problem, provides guidance on how to filter the export to stay within the limit, and files a bug report noting that the 422 error wasn't surfaced to the user with a clear message.

Total elapsed time from ticket to diagnosis: the time it took the customer to click a link and try the export once. No screen share. No DevTools walkthrough. No back-and-forth questions. The constraint was just waiting for the customer to respond — which is true of any support workflow.

Use Cases Beyond Bug Reports

Magic links are optimised for debugging, but the same mechanism is useful for other support scenarios:

Onboarding issues. When a new customer can't complete setup, a magic link lets you see exactly where they're getting stuck — which step, what the page shows, what errors if any are firing — without needing to walk through it with them live.
Integration troubleshooting. Third-party integrations fail in ways that are difficult to reproduce outside the customer's environment. A session capture shows the exact network requests being made and the exact responses coming back.
Performance complaints. "The page is really slow" is hard to investigate from a ticket. A session replay lets you measure the actual load times and network request durations in the customer's environment.
Escalation documentation. Before escalating a ticket to engineering, a support agent can use a magic link to capture a session replay that serves as precise reproduction documentation — saving the engineering team from having to gather context themselves.

The Bigger Picture

Magic links are one implementation of a broader principle: diagnostic friction should be on your team, not your customers. You have the tools, the context, and the motivation to gather debugging information efficiently. Your customer has a problem they want solved.

The best support tooling minimises what customers need to do to help you help them. A link they can click is about as minimal as it gets.