Go to developer

Web SDK

SPA-friendly OAuth Verify with createKeyraAuth — popup or redirect, then validate on your server.

On this page

Install

InstallBash
npm install git+https://github.com/Ciright-Inc/keyra-web-sdk.git

createKeyraAuth

BROWSERTypeScript
import { createKeyraAuth } from "@keyra/web-sdk";

const keyra = createKeyraAuth({
  domain: "https://auth.keyra.ie", // default
  clientId: "cp_test_YOUR_PUBLISHABLE_ID",
  redirectUri: window.location.origin + "/auth/keyra/callback",
  // scope?: default "openid profile phone"
  // timeoutMs?: default 120000
});
OptionDefaultDescription
domainhttps://auth.keyra.ieKEYRA auth host
clientId—Publishable client id (required)
redirectUri—Exact registered callback URI (required)
scopeopenid profile phoneUsed with POST /oauth/authorize/init
timeoutMs120000Flow timeout (ms)

Verify methods

BROWSERTypeScript
// mode: "auto" | "popup" | "redirect" (auto prefers popup on desktop)
const result = await keyra.verify({ mode: "popup" });

// Explicit helpers
const popupResult = await keyra.verifyWithPopup();
await keyra.verifyWithRedirect(); // navigates away

// On the callback page after redirect:
const resumed = await keyra.handleRedirectCallback();
  • verify / verifyWithPopup — open hosted UI in a popup; wait for completion.
  • verifyWithRedirect — full-page navigation to hosted UI.
  • handleRedirectCallback — resume on redirectUri after KEYRA returns with code + state.

Transient PKCE/state for redirect lives in sessionStorage under keyra_sdk_transient.

Result shape

responseVerify result
JSON
{
  "accessToken": "…",
  "verificationToken": "…", // same value as accessToken
  "user": {
    "id": 123,
    "phone": "+353…",
    "fullName": null,
    "email": null
  },
  "expiresIn": 3600,
  "status": "approved",
  "method": "popup" // or "redirect"
}

Send token to backend

BROWSER → your APITypeScript
await fetch("/api/auth/keyra", {
  method: "POST",
  headers: { "Content-Type": "application/json" },
  credentials: "include",
  body: JSON.stringify({
    verification_token: result.verificationToken, // same as result.accessToken
  }),
});

Errors

ErrorCodes / when
KeyraOAuthErrorpopup_blocked, popup_closed, verification_denied, callback_state_missing, invalid_state
KeyraTimeoutErrorFlow exceeded timeoutMs

Symptom guide: Errors & troubleshooting.

Dual exports

@keyra/web-sdk also exports async generatePkce() (Web Crypto) and createKeyraServer for browser/Node dual use. Server-preferred sync PKCE lives in @keyra/typescript-sdk — see PKCE and Server SDK.