CLIENT_ID

DOMAIN

ISSUER

Gain insights into using Okta for secure user authentication in JavaScript applications. Explore SSO, MFA, and AD/LDAP integration with practical examples and management tips. Discover further resources.

Authenticating Application Users with the Okta API (1).png

okta.tar.gz

React

Okta is a secure, customizable, and easy-to-integrate solution to add authentication and authorization services to applications. It features provisioning, single sign-on (SSO), Active Directory (AD) and Lightweight Directory Access Protocol (LDAP) integration, centralized deprovisioning of users, multi-factor authentication (MFA), mobile identity management, and flexible policies for organization security and control.

We'll learn about Okta organizations and their management. We'll also learn how to use Okta as the user store for single-page applications and sign users in with a practical example.

Lastly, this course will provide some recommendations and resources for further exploration of Okta.

Authenticating Application Users with Okta in JavaScript

We'll now put together a React application with an Okta-hosted sign-in page to allow users to sign in and sign out of the application. After signing in, the user will be able to view their profile information. This process is completed through the authorization code flow where the user is redirected to the Okta-hosted sign-in page. After the user is authenticated, they are redirected to the application with an access code that is then exchanged for an access token.

# Run the application

Click the "Run" button below. Then, click the URL next to "Your app can be found at:" in the widget below to open the application in a new tab.

Once the application is up and running, you'll see a login page. When you click the "Login to Okta" button, you'll be redirected to the Okta-hosted sign-in page. Enter your username and password to sign in.

We can sign in using the same username and password as for our developer organization, or we can use a known username and password from our Okta Directory.

> **Note:**  In case we are currently using our developer console, we will be automatically logged into our application as the same user that is using the developer console. This is because we already have an SSO session for our organization. In case we want to test the flow from the beginning, we'll need to log out of the developer console.

Once you've successfully signed in, you'll be redirected to the home page that'll display your name and email address. You'll also be provided a button each to view your complete profile and sign out of the application.

See a React application in action using an Okta-hosted sign-in page for users to sign in and sign out.

Introduction

Okta Hosted Login in React

Conclusion

Demo Application