Authenticate using redirect URL params

import { StytchClient } from '@stytch/vanilla-js';

const stytch = new StytchClient('${publicToken}');

export const authenticateByUrl = () =>
  stytch.authenticateByUrl({ session_duration_minutes: 60 }).then((result) => {
    if (!result) {
      // No token found in URL. If this page is only meant to be reached by redirect you
      // may want to redirect the user back to the login page
      return;
    }

    if (!result.handled) {
      // Manual handling required, such as for reset password flows
      return;
    }

    // Authentication successful
  });

import { StytchClient } from '@stytch/vanilla-js';

const stytch = new StytchClient('${publicToken}');

export const authenticateByUrl = () =>
  stytch.authenticateByUrl({ session_duration_minutes: 60 }).then((result) => {
    if (!result) {
      // No token found in URL. If this page is only meant to be reached by redirect you
      // may want to redirect the user back to the login page
      return;
    }

    if (!result.handled) {
      // Manual handling required, such as for reset password flows
      return;
    }

    // Authentication successful
  });

Added in @stytch/vanilla-js v5.44

To handle tokens passed via URL after the user has authenticated through an outside page, such as via Email Magic Link or OAuth, use the authenticateByUrl() method. This method parses the current page’s URL params and calls the appropriate authenticate() method associated with the token. authenticateByUrl takes an option object with one required property, session_duration_minutes. Other properties are passed through to the underlying authenticate() method.

session_duration_minutes

number

required

Set the session lifetime to be this many minutes from now.This value must be a minimum of 5 and may not exceed the maximum session duration minutes value set in the Frontend SDK page of the Stytch Dashboard.This param is optional for impersonation token types, but because this function can be used for any type of token, this param is typed as required.

Currently the following are supported:

The response from the authenticate call is returned as the data property.

{
  handled: true,
  tokenType: 'magic_links',
  data: {
    "request_id": "requestId",
    "status_code": 200,
    "user_id": "userId",
    "session_token": "token",
    "session": {...}
  },
}

The following is parsed but not handled:

Password reset by email

In this case, the handled property on the returned object will be false. Use the token property to call the resetByEmail() method.

{
  handled: false,
  tokenType: 'reset_password',
  token: '...',
}

If a token is not found in the URL, the returned promise will resolve to null.

parseAuthenticateUrl

If you only want to get the token without calling authenticate(), you can use parseAuthenticateUrl(). This function returns synchronously and can be useful if you want to check the token type before calling authenticate. The following token types can be returned:

oauth
magic_links
impersonation
reset_password (not handled)
login (not handled)

For methods which authenticateByUrl can handle, the method will also return handled: true.

{
  token: '...',
  tokenType: '...',
  handled: true | false,
}

If a token is not found in the URL, the function will return null.

⌘I

​parseAuthenticateUrl

parseAuthenticateUrl