Okta: Getting Started Follow

The document describes the steps to create and configure an AppVisualizer app protected by Okta.
It assumes that you already have an Okta account with admin access.

Step A: AppVisualizer Template

1. Restore backup OktaApp_Template.zip (attached to this document).
   It will create application "OktaApp" and service "getConfig".
2. Reaname OktaApp (optional).
3. Regenerate the app.

Lunch the application to obtain the URLs OktaLogin.html and Home.html:

https://<HOSTNAME>/ServiceManager/apps/<APP_NAME>/OktaLogin.html
https://<HOSTNAME>/ServiceManager/apps/<APP_NAME>/Home.html

Step B: Create a WebApp in Okta

Login to Okta with your admin account.

A) Create and configure a WebApp

1. Go to Admin > Applications > Applications, and create a new WebApp.
   (your app should be Web Application for this tutorial to work. SPA requires pkce + slightly different steps).
2. Once created, go to your app > General > Edit, and configure according to the screenshot:
   
3. Save.

B) Assign your user (or the group it belongs to) to the application:

1. Admin > Applications > Applications.
2. Click on your app > Assignments > Assign > Assign to People or Assign to Groups.
3. Save.

https://faq.miniorange.com/knowledgebase/getting-app-not-assigned-error-during-test-configuration-okta/

Step C: Trusted Origins configuration in Okta

Login to Okta with your admin account.

1. Admin > Security > API.
2. "Trusted Origins" tab > 'Add Origin', and fill in the form as followed:
   • Name: <SERVICE_MANAGER_HOSTNAME>
   • Origin URL: <SERVICE_MANAGER_HOSTNAME>
   • CORS: (checked).
   • Redirect: (checked).
3. Save.

Step D: System properties

A) Login to Okta > Admin > Applications > Applications > your app > Sign On tab.

Write down the Issuer and Audience fields for the next step.

B) In your Service Manager > Admin > System Properties, set the following Environment Variables:

OKTA_REDIRECT_URL = https://<HOSTNAME>/ServiceManager/apps/<APP_NAME>/Home.html
OKTA_CLIENT = ****************

And the following System Properties:

OAUTH2_JWKS = https://<HOSTNAME>/ServiceManager/www/okta.keys
OAUTH2_ISSUER = https://***.okta.com
OAUTH2_AUDIENCE = ${env.OKTA_CLIENT}

Set the properties above according to the following table:

For more information refer to "Step 4: ServiceManager System Properties" section in IDCS: Getting Started.

Step E: AppVisualizer app

We'll continue to edit the ServiceManager app we created in Step A.

1.  ServiceManager > Applications >your app > OktaLogin.html > Step 4 > JavaScript.
2. Update the baseUrl and issuer in the OktaSignIn configuration:
   
3. (optional) If you would like to expose additional claims from the id-token to the client side, you may do this by storing them in sessionStorage in a similar way to the following example (line 48):
   
4. Go to AppVisualizerStep5 > CommonJS: Update the postLogoutRedirectUri.
   You may disable the line that avoids revoking id_token on the server if postLogoutRedirectUri is declared in "Logout redirect URIs" in Okta config (as described in Step B of this document).
5. Save.
6. Run your app to test it.

Step F: Service configurations

For each service you plan to use in your app (and needs to be protected by Okta):

1. In Service Manager > Services > Edit your service.
2. Advanced Details > Authentication Type > Select 'OAUTH2 Bearer'.
3. (Optional) Refer to OAuth2 claims in input parameter default values via ${oauth2.CLAIM_KEY}.

Attachments: