Unable to setup user authentication (OAuth) in Enterprise 11.1

Thomas_Puthusserry

Could someone help me with this? I am trying to setup a user authentication following the guidance here: How to implement user authentication | Documentation | Esri Developer (arcgis.com). It works fine in ArcGIS Online. However it is not working when I use it for Enterprise 11.1.

Steps followed:

1. Created an application in the enterprise portal, added redirect URLs

2. Used the ClientID in the code (see below)

3. Added the enterprise portal URL (line 66)

It loads the authentication page s in images below: once authenticated it goes to another login page asking sign in to ArcGIS Online

A similar question was asked here a while ago: OAuth on Enterprise Server unexpected behaviour - Esri Community but there is no answer.

Any help will be appreciated.

Thomas Puthusserry

---------------HTML code file below: ----------------

<!DOCTYPE html>

<html>

<head>

<title>User authentication starter app (ArcGIS REST JS)</title>

<style>

html,

body,

#map {

width: 100%;

height: 100%;

padding: 0;

margin: 0;

background-color: #f3f3f3;

z-index: 3;

}

.auth-buttons {

position: absolute;

top: 5px;

left: 5px;

width: 250px;

height: auto;

z-index: 5;

}

.hide {

display: none

}

</style>

</head>

<body>

<calcite-panel class="auth-buttons">

<calcite-button id="login-button">Sign in with ArcGIS</calcite-button>

<calcite-button id="logout-button" class="hide" appearance="outline-fill">Sign out</calcite-button>

</calcite-panel>

require([

'esri/portal/Portal',

'esri/identity/OAuthInfo',

'esri/identity/IdentityManager',

], (Portal, OAuthInfo, IdentityManager) => {

// UI elements

const loginButton = document.querySelector('#login-button');

const logoutButton = document.querySelector('#logout-button');

const greeting = document.querySelector('h1');

const info = new OAuthInfo({

appId: 'GUUymtJk8H5MhWHw',

popup: false,

portalUrl: 'https://ourdomain.com/portal'

});

IdentityManager.registerOAuthInfos([info]);

loginButton.addEventListener('click', () =>

IdentityManager.getCredential(info.portalUrl + '/sharing')

);

logoutButton.addEventListener('click', () => {

IdentityManager.destroyCredentials();

window.location.reload();

});

const handleLoginSuccess = () => {

const portal = new Portal();

portal.authMode = 'immediate';

portal.load().then(() => {

debugger;

console.log(portal);

// When the user is successfully logged in...

// ... hide the login button

loginButton.style = 'display: none';

// ... show the logout button

logoutButton.style = 'display: inline-block';

// ... greet the user by the user's name

greeting.textContent = `Welcome back, ${portal.user.fullName}!`;

});

};

IdentityManager.checkSignInStatus(info.portalUrl + '/sharing')

.then(handleLoginSuccess)

.catch(() => console.log('Not logged in'));

});

</script>

</body>

</html>