Orchestration SDKs

Step 2. Authenticating with external IdPs

PingOne Advanced Identity Cloud PingAM JavaScript

Your app must handle the relevant node types your server returns when a user attempts to authenticate using an external IdP.

Initially, the client receives a list of the external IdPs a user can select for authentication, in a SelectIdPCallback.

After returning the selected external IdP to the server, it responds with a RedirectCallback with the selected external IdP’s authentication endpoints.

Your client then redirects the user to the external IdP to authenticate, which then redirects them back afterwards.

Handling external IdP nodes in Advanced Identity Cloud or PingAM journeys

When encountering a SelectIdPCallback callback in a journey, use the getProviders() method to display the available providers, and setProvider() when the user makes a choice:

Getting a list of providers, and setting the chosen one
// Handling 'SelectIdPCallback'
const callback = step.getCallbackOfType(‘SelectIdPCallback’)

// Get a list of the external IdPs
const providers = callback.getProviders();

// Display providers
// User makes choice

// Set provider on the callback
callback.setProvider(chosenProvider);

// Submit the current step and get the next one
step = await journeyClient.next(step);

The next callback is the RedirectCallback. Detect the presence of the callback, and pass the step as a parameter to the redirect method:

Handling redirect callbacks to authenticate at the external IdP
if (step.getCallbacksOfType(callbackType.RedirectCallback).length) {
  redirect(step);
}

This triggers a full browser redirect to the IdP. When the user authenticates with the IdP, they are redirected back to the app. When your application handles this redirect, check for the query parameters code and state for Facebook and Google, or form_post_entry for Apple.

If they’re present, call the resume() method:

Resuming an existing journey
// Get the code and state from the URL query parameters
const codeParam = params.get('code');
const stateParam = params.get('state');

let resumeUrl = '';

if (codeParam && stateParam) {
  resumeUrl = window.location.href;
}

// If we were redirected here from an IDP with 'code' and 'state' params, resume the flow
if (resumeUrl) {
  const resumeStep = await client?.resume(resumeUrl);
} else {
  const initialStep = await client?.start();
}

The resume() method gathers information from the previous step saved to browser storage before the redirect to resume the authentication journey.