Integrate OpenPass with Auth0

OpenPass provides SSO authentication services based on the OIDC framework. With Okta's Auth0, you can add a custom sign-in option for OpenPass to connect to an OAuth2 authorization server.

IMPORTANT: Make sure you have registered for an Auth0 account first.

Here is an overview of the steps needed to configure the Auth0 connection and enable OpenPass for your applications in the Auth0 domain.

  1. Create the Auth0 connection by entering information from your OpenPass registration documentation.
  2. Test the connection. Customize your headers to verify credentials for retrieving user profiles.
  3. Connect your application to Auth0.
  4. Customize the branding of the universal login to match your application.

The following sections provide more details for each step.

NOTE: The following instructions that rely on third-party UI are current as of February 27, 2024.

1. Create the connection

Configure the connection using the following instructions.

Step Description Notes
1 In your Auth0 dashboard, go to Authentication > Social in the navigation pane, then click Create Social Connection. N/A
2 Scroll to the bottom of the page, then select the Create Custom tile. N/A
3 In the New Custom Social Connection page, complete the form, including entering the following:
  • Authorization URL: The authorization URL as referenced in the OpenPass registration documentation.
  • Token URL: The token URL as referenced in the OpenPass registration documentation.
  • Scope: openid
  • Client ID: The client ID from the OpenPass application registration.
  • Client Secret: The client secret from the OpenPass application registration.
 Since you are using the client secret, you may opt to not enforce PKCE. If so, inform the OpenPass team that you need PKCE disabled because you are creating a connection in Auth0.
4 Click Create. N/A

This creates the Auth0 connection with OpenPass.

2. Test the connection

To test the connection, start by enabling the OpenPass service to verify the credentials from where the request is being made. To do so, add the following to your custom headers.

IMPORTANT: The ClientID:ClientSecret value should be Base64-encoded. You can use https://www.base64encode.org/ to generate the encoded string, then remove the "=" at the end of the encoded value.

{ 
"Authorization": "Basic <Base 64 encoded ClientID:ClientSecret>" 
}

After updating the custom headers, use the following code snippet for testing.

   try { 
        bodyParsed = JSON.parse(body); 
      } catch (jsonError) { 
        return callback(new Error(body)); 
      } 
      const profile = { 
        user_id: bodyParsed.sub 
      }; 
      callback(null, profile); 
    } 
  ); 
}

A successful response returns the user profile with the user_id property. Otherwise, you will get an error message.

3. Add the connection to your application

After you've configured the custom connection, do the following to connect your application to Auth0.

Step Description
1 In Auth0, go to Applications > Applications in the navigation pane, then select the application that will get the OpenPass connection added to its login.
2 At the top of the page, click the Connection tab, then toggle the OpenPass connection to turn on authentication.
Your application now has OpenPass as one of its authentication connections.

Adding the connection to your application completes the integration. You can continue to the next section to customize the branding of the universal login.

4. Customize the branding of the universal login

Customize the universal login by following Auth0 customization documentation to match the branding for your application and the recommended co-branding guidelines for OpenPass.

Additional resources

For more information, see the following pages: