Tutorial
This tutorial guides you through adding the Ping (ForgeRock) Login Widget to your application in the modal or inline form factor.
Prerequisites
You need to set up your PingOne Advanced Identity Cloud or PingAM instance with an authentication journey, and a demo user. To obtain access tokens, you also need to create an OAuth 2.0 client.
You may need to edit the CORS configuration on your server.
-
Advanced Identity Cloud
-
Self-managed PingAM server
Steps
- Step 1. Install the widget
-
In this step, you use
npmto add the Ping (ForgeRock) Login Widget to your project. It also covers how to download and build the Ping (ForgeRock) Login Widget to support custom requirements. - Step 2. Configure the CSS
-
In this step, you add the default CSS to your app, and learn how to use layers to control the CSS cascade.
- Step 3. Import the widget
-
In this step, you import the modules from the Ping (ForgeRock) Login Widget you want to use in your app.
- Step 4. Configure the SDK
-
In this step, you provide the configuration necessary for the Ping (ForgeRock) Login Widget to contact your server, such as which realm to use, and the server URL.
- Step 5. Instantiate the widget
-
In this step, you choose where in your app to mount the Ping (ForgeRock) Login Widget, and then instantiate an instance, choosing either the inline or modal form factor.
- Step 6. Start a journey
-
In ths step, you start a journey so that the Ping (ForgeRock) Login Widget can display the UI for the first callback.
- Step 7. Subscribe to events
-
In this step, you subscribe to observables to capture and react to events that occur during use of the Ping (ForgeRock) Login Widget.