Step 3. Configure connection properties

In this step, you configure the sample app to connect to the authentication tree/journey you created when setting up your server configuration.

Choose how you want to configure the sample app. You can either configure the sample by using dynamic configuration, or by create a .env file.

Dynamic configuration
Create a .env file

Open the /sdk-sample-apps/javascript/embedded-login/src/main.js file.

Update the call to Config.setAsync() with the following code:

await Config.setAsync({
  serverConfig: {
    wellknown: '{WELL_KNOWN}'
  },
  clientId: '{WEB_OAUTH_CLIENT}',
  tree: '{TREE}',
  scope: '{SCOPE}',
  redirectUri: `${window.location.origin}/callback.html`
});

Replace the placeholder strings with the values you obtained when preparing your environment.

{WELL_KNOWN}

The .well-known endpoint of your server.

How do I find my PingOne Advanced Identity Cloud .well-known URL?

You can view the .well-known endpoint for an OAuth 2.0 client in the PingOne Advanced Identity Cloud admin console:

Log in to your PingOne Advanced Identity Cloud administration console.
Click Applications, and then select the OAuth 2.0 client you created earlier. For example, sdkPublicClient.
On the Sign On tab, in the Client Credentials section, copy the Discovery URI value.

For example, https://openam-forgerock-sdks.forgeblocks.com/am/oauth2/alpha/.well-known/openid-configuration

If you are using a custom domain, your .well-known is formed as follows:

https://<custom-domain-fqdn>/.well-known/openid-configuration

Learn more in Access OIDC configuration discovery endpoint.

How do I find my PingAM .well-known URL?

To form the .well-known URL for an PingAM server, concatenate the following information into a single URL:

The base URL of the PingAM component of your deployment, including the port number and deployment path.

For example, https://openam.example.com:8443/openam
The string /oauth2
The hierarchy of the realm that contains the OAuth 2.0 client.

You must specify the entire hierarchy of the realm, starting at the Top Level Realm. Prefix each realm in the hierarchy with the realms/ keyword.

For example, /realms/root/realms/customers

If you omit the realm hierarchy, the top level ROOT realm is used by default.
The string /.well-known/openid-configuration

For example, https://openam.example.com:8443/openam/oauth2/realms/root/.well-known/openid-configuration

{WEB_OAUTH_CLIENT}

The client ID from your OAuth 2.0 application.

For example, sdkPublicClient

{TREE}

The simple login journey or tree you created earlier.

For example sdkUsernamePasswordJourney.

{SCOPE}

The scopes you added to your OAuth 2.0 application.

For example, address email openid phone profile

The result resembles the following:

main.js

await Config.setAsync({
  serverConfig: {
    wellknown: 'https://openam-forgerock-sdks.forgeblocks.com/am/oauth2/realms/root/realms/alpha/.well-known/openid-configuration'
  },
  clientId: 'sdkPublicClient',
  tree: 'sdkUsernamePasswordJourney',
  scope: 'openid profile email address',
  redirectUri: \`${window.location.origin}/callback.html`
});

Copy the .env.example file in the /sdk-sample-apps/javascript/embedded-login folder and save it with the name .env within this same directory.

Your .env file has the following initial contents:
Initial .env file
```
SERVER_URL=$SERVER_URL
REALM_PATH=$REALM_PATH
SCOPE=$SCOPE
TIMEOUT=$TIMEOUT
TREE=$TREE
WEB_OAUTH_CLIENT=$WEB_OAUTH_CLIENT
```
Replace the placeholder strings with the values you obtained when preparing your environment.

$SERVER_URL

The base URL of the server to connect to.

Identity Cloud example:

https://openam-forgerock-sdks.forgeblocks.com/am

Self-hosted example:

https://openam.example.com:8443/openam

$REALM_PATH

The realm in your server.

Usually, root for AM and alpha or bravo for Advanced Identity Cloud.

$SCOPE

The scopes you added to your OAuth 2.0 application.

For example, address email openid phone profile

$TIMEOUT

The time, in milliseconds, to allow for each request that communicates with your server.

The default value we recommend is 5000 milliseconds.

$TREE

The simple login journey or tree you created earlier, for example sdkUsernamePasswordJourney.

$WEB_OAUTH_CLIENT

The client_id of the OAuth 2.0 client profile to use , for example sdkPublicClient.

Here’s an example; your values may vary:
```
AM_URL=https://openam-forgerock-sdks.forgeblocks.com/am
REALM_PATH=alpha
SCOPE=openid profile email address
TIMEOUT=5000
TREE=sdkUsernamePasswordJourney
WEB_OAUTH_CLIENT=sdkPublicClient
```

Ping SDKs

Step 3. Configure connection properties