Redirect Flow

When to use redirect#

• Paste script: mode: "redirect" (or let auto choose when popup is unsuitable).
• Web SDK: verifyWithRedirect() then handleRedirectCallback() on the callback route.

Exact redirect URI#

• http://localhost:3000/callback ≠ http://localhost:3000/callback/
• http vs https must match the registered value
• Register both local and production URIs in the Developer Portal

Paste script#

KeyraOAuth.renderButton("#keyra-login", {
  authOrigin: "https://auth.keyra.ie",
  clientId: "cp_test_YOUR_PUBLISHABLE_ID",
  redirectUri: "http://localhost:3000/auth/keyra/callback",
  mode: "redirect",
  autoCompleteRedirect: true, // default true
  onSuccess: async function (result) { /* POST token to backend */ },
  onError: function (err) { console.error(err); },
});

With autoCompleteRedirect: true (default), the script detects callback query params and finishes the exchange. You can also call KeyraOAuth.completeRedirectCallback(opts) explicitly on the callback page.

Web SDK#

await keyra.verifyWithRedirect();
// navigates to KEYRA hosted UI

const result = await keyra.handleRedirectCallback();
// then POST result.verificationToken to your backend

Missing or mismatched state → callback_state_missing / invalid_state (KeyraOAuthError).

PKCE storage keys#

After callback#

Next: Server validation.