Step 3. Configure connection properties

In this step, you configure the sample app to connect to the OAuth 2.0 application you created in PingOne.

In the IDE of your choice, open the sdk-sample-apps folder you cloned in the previous step.
Open the /javascript/central-login-oidc/src/main.js file.
Locate the Config.setAsync() method and update the properties to match your PingOne environment:
```
await Config.setAsync({
  clientId: process.env.WEB_OAUTH_CLIENT, // e.g. 'ForgeRockSDKClient' or PingOne Services Client GUID
  redirectUri: `${window.location.origin}`, // Redirect back to your app, e.g. 'https://localhost:8443' or the domain your app is served.
  scope: process.env.SCOPE, // e.g. 'openid profile email address phone revoke' When using PingOne services revoke scope is required
  serverConfig: {
    wellknown: process.env.WELL_KNOWN,
    timeout: process.env.TIMEOUT, // Any value between 3000 to 5000 is good, this impacts the redirect time to login. Change that according to your needs.
  },
});
```
Replace the following strings with the values you obtained when you registered an OAuth 2.0 application in PingOne:
process.env.WEB_OAUTH_CLIENT

The client ID from your OAuth 2.0 application in PingOne.

For example, 6c7eb89a-66e9-ab12-cd34-eeaf795650b2

process.env.SCOPE

The scopes you added to your OAuth 2.0 application in PingOne.

For example, openid profile email phone revoke

process.env.WELL_KNOWN

The .well-known endpoint from your OAuth 2.0 application in PingOne.

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

To find the .well-known endpoint for an OAuth 2.0 client in PingOne:

Log in to your PingOne administration console.

Go to Applications > Applications, and then select your OAuth 2.0 client.

For example, sdkPublicClient.

On the Overview tab, expand the Connection Details section, and then copy the OIDC Discovery Endpoint value.

For example, https://auth.pingone.com/3072206d-c6ce-ch15-m0nd-f87e972c7cc3/as/.well-known/openid-configuration

process.env.TIMEOUT

Enter how many milliseconds to wait before timing out the OAuth 2.0 flow.

For example, 3000
The result resembles the following:
```
await Config.setAsync({
  clientId: "6c7eb89a-66e9-ab12-cd34-eeaf795650b2",
  redirectUri: `${window.location.origin}`,
  scope: "openid profile email phone revoke",
  serverConfig: {
    wellknown: "https://auth.pingone.com/3072206d-c6ce-ch15-m0nd-f87e972c7cc3/as/.well-known/openid-configuration",
    timeout: 3000
  },
});
```
Alter the logout object as follows:
1. In the forgerock.FRUser.logout() method, add the following parameter:
  
  {logoutRedirectUri: `${window.location.origin}`}
  
  The presence of this parameter causes the SDK to use a redirect flow for ending the session and revoking the tokens, which PingOne servers require.
2. Remove or comment out the following line:
  
  location.assign(`${document.location.origin}/`);
The result resembles the following:
const logout = async () => { try { await FRUser.logout({ logoutRedirectUri: `${window.location.origin}` }); // location.assign(`${document.location.origin}/`); } catch (error) { console.error(error); } };
Optionally, specify which of the configured policies PingOne uses to authenticate users.

In the /javascript/central-login-oidc/src/main.js file, find each instance of the getTokens method that has a login: 'redirect' parameter and add an additional acr_values query parameter:
```
await TokenManager.getTokens({
  login: 'redirect',
  query: {
    acr_values: "<Policy IDs>"
  }
});
```
Replace <Policy IDs> with either a single DaVinci policy, by using its flow policy ID, or one or more PingOne policies by specifying the policy names, separated by spaces or the encoded space character %20.

Examples:

DaVinci flow policy ID

acr_values: "d1210a6b0b2665dbaa5b652221badba2"

PingOne policy names

acr_values: "Single_Factor%20Multi_Factor"

For more information, refer to Authentication policies.

Ping SDKs

Step 3. Configure connection properties