Skip to main content

Documentation Index

Fetch the complete documentation index at: https://docs.alterauth.com/llms.txt

Use this file to discover all available pages before exploring further.

The Connect SDK is a 3.5 KB gzipped, zero-dependency JavaScript package that opens an Alter-hosted Connect UI in a popup (desktop) or full-page redirect (mobile). It’s the frontend half of the Call APIs on behalf of users flow.
npm install @alter-ai/connect
Or via CDN:
<script src="https://cdn.jsdelivr.net/npm/@alter-ai/connect@latest/dist/alter-connect.umd.js"></script>
Framework-agnostic. Works with React, Vue, Angular, Svelte, or no framework. For a step-by-step integration, see Embed the Connect widget. This page is API reference.

AlterConnect.create(config?)

Construct an instance.
import AlterConnect from "@alter-ai/connect";

const alterConnect = AlterConnect.create({ debug: true });
FieldTypeDefault
debugbooleanfalse — when true, logs lifecycle events to the console.
Returns an AlterConnect instance.

alterConnect.open(options)

Open the Connect UI.
await alterConnect.open({
  token: string,
  onSuccess: (connection: Connection) => void,
  onError?: (error: AlterError) => void,
  onExit?: () => void,
  onEvent?: (eventName: string, metadata: object) => void,
});
OptionRequiredDescription
tokenyesA session token minted by the backend via app.createConnectSession().
onSuccessyesFired once the OAuth flow completes successfully.
onErrornoFired on any failure (popup blocked, session expired, OAuth error, user denial).
onExitnoFired when the user closes the popup without finishing.
onEventnoFired for lifecycle / analytics events: OPEN, PROVIDER_SELECTED, OAUTH_STARTED, OAUTH_COMPLETE, EXIT.
The widget picks the right transport based on device:
  • Desktop: a centered popup (500×700 px) communicating via postMessage.
  • Phone (≤480 px width) or tablet portrait: a full-page redirect that returns to the return_url configured on the session.
  • Tablet landscape: popup.

Connection

type Connection = {
  grant_id: string;            // store this if persistence is required
  provider: string;            // e.g. "google"
  provider_name: string;       // display name, e.g. "Google"
  account_identifier: string;  // user account at the provider (typically email)
  timestamp: string;           // ISO timestamp
  operation: "creation" | "reauth";
  scopes: string[];
  status: "active" | "pending" | "error";
  metadata?: Record<string, unknown>;
};
When JWT identity is configured on the backend, persisting grant_id in application storage is optional — the backend resolves grants from the user’s JWT on every call.

AlterError

type AlterError = {
  code: string;     // e.g. "popup_blocked", "invalid_token", "session_expired"
  message: string;
  details?: Record<string, unknown>;
};
Common error codes:
CodeCauseFix
popup_blockedThe browser blocked the popup.Call open() synchronously inside the click handler, not after an await.
invalid_tokenSession token is malformed.Mint a fresh session.
session_expiredSession token expired (default lifetime 10 min) or was already used.Mint a fresh session per click.
oauth_deniedThe user denied at the provider’s consent screen.Surface the cancellation; offer to retry.
oauth_provider_errorThe provider returned an error during authorize/exchange.details carries the provider’s error code.

alterConnect.close()

Close the popup (if open). No-op on the redirect flow.

alterConnect.destroy()

Tear down the instance. Releases event listeners and any pending callbacks.

alterConnect.isOpen() -> boolean

Whether the popup is currently open.

alterConnect.getVersion() -> string

The SDK version (e.g., "0.3.0").

Browser support

  • Chrome / Edge 90+
  • Firefox 88+
  • Safari 14+
  • iOS Safari 14+
  • Chrome Mobile

Backend integration

The session token passed to open() is minted on the backend with the app key:
session = await app.create_connect_session(
    allowed_providers=["google", "slack"],
    allowed_origin="https://app.example.com",
    user_token=user.jwt,            # binds the resulting grant to this user
    agent=agent_id,                 # optional — also writes a delegation row
    return_url="https://app.example.com/connected",  # required for mobile
)
return {"sessionToken": session.session_token}
See Embed the Connect widget for the full backend half.

allowed_origin semantics

The allowed_origin field on the session controls postMessage security for the desktop popup. Three patterns:
PatternBehavior
allowed_origin: "https://app.example.com"The popup sends postMessage to that exact origin. Recommended for production.
allowed_origin omitted, app has website_url set in the portalFalls back to the configured website_url.
allowed_origin: "*"Rejected. Wildcards are not supported.
Trailing slashes, paths, or missing schemes raise validation errors. Use bare scheme + host only.