B2B Saas Authentication

/

Frontend SDKs

/

Headless

/

Email One-time Passcodes (OTPs)

/

Authenticate OTP

Authenticate

The Authenticate method wraps the authenticate API endpoint which validates the OTP code passed in.

If there is a current Member Session, the SDK will call the endpoint with the session token. This will add the new factor to the existing Member Session.

If there is an intermediate session token, the SDK will call the endpoint with it. If the resulting set of factors satisfies the organization's primary authentication requirements and MFA requirements, the intermediate session token will be consumed and converted to a Member Session. If not, the same intermediate session token will be returned.

If this method succeeds and the Member is not required to complete MFA, the Member will be logged in, granted an active session, and the session cookies will be minted and stored in the browser.

If this method succeeds and MFA is required, the intermediate session token will be stored in the browser as a cookie.

You can listen for successful login events anywhere in the codebase with the stytch.session.onChange() method or useStytchMemberSession hook if you are using React.

Method parameters

email_address* string
organization_id* string
code* string
session_duration_minutes* int
locale string
import React, { useCallback, useState } from 'react';
import { useStytchB2BClient } from '@stytch/react/b2b';

export const Authenticate = () => {
  const stytch = useStytchB2BClient();
  const [code, setCode] = useState('');

  // orgID used during loginOrCreate
  const orgID = 'organization-test-123';

  const authenticate = async () => {
    const { member_session } = await stytch.otps.email.authenticate({
      code: code,
      email_address: 'sandbox@stytch.com',
      organization_id: orgID,
      session_duration_minutes: 60,
    });
    console.log({ member_session });
  };

  const handleChange = useCallback((e) => {
    setCode(e.target.value);
  }, []);

  return (
    <form>
      <label htmlFor="otp-input">Enter code</label>
      <input id="otp-input" autoComplete="one-time-code" inputMode="numeric" pattern="[0-9]*" onChange={handleChange} />
      <button onClick={authenticate} type="submit">
        Submit
      </button>
    </form>
  );
};

RESPONSE

200
{
    "status_code": 200,
    "request_id": "request-id-test-b05c992f-ebdc-489d-a754-c7e70ba13141",
    "method_id": "member-email-test-1dd089b3-8904-47ef-b943-987968e549d4",
    "member_id": "member-test-32fc5024-9c09-4da3-bd2e-c9ce4da9375f",
    "organization_id": "organization-test-07971b06-ac8b-4cdb-9c15-63b17e653931",
    "session_jwt": "example_jwt",
    "session_token": "mZAYn5aLEqKUlZ_Ad9U_fWr38GaAQ1oFAhT8ds245v7Q",
    "intermediate_session_token": "",
    "member_authenticated": true,
    "mfa_required": null,
    "member_session": {...},
    "member": {...},
    "organization": {...}
  }