Multiple Apps

1501
3
Jump to solution
05-12-2021 03:24 AM
Bernd_Loigge
New Contributor III

Hi,

We have a root / master application (application item with client_id and secret). This web application queries portal items (other appliction items) and lists them in a html table (with title, thumbnail, description). When the logged in user of my master application clicks on one of the items a new tab opens and the url points to this "sub application".

Unfortunately now the user has to sign-in again. When the user logs in, it looks like the old token of the master application stored in the esri_auth cookie is invalidated and a new token for the clicked "sub-application" is generated.

Any thumbnails (which are shown in the html table) aren't visible anymore in the master application afterwards, because it seems that the esri_auth cookie, which now has a new token from the other application, has no rights for the root application after signing into the "sub application". See the screenshot attached with the error that shows up for every thumbnail (and any other portal item requested from the root application).

So my question is: Is there any way to reuse a token for other applications? I already tried the

 

IdentityManager.registerToken()

 

   method but with no luck. 

My ideal workflow would be to look for the esri_auth cookie, if it exists parse the token and use it in the "sub application". If the user has the correct rights no signin dialog should pop up.

0 Kudos
1 Solution

Accepted Solutions
Bernd_Loigge
New Contributor III

@ReneRubalcava & @Anonymous User  - thanks for your suggestions. Both ideas look promising. I was able to find out a similar way in the meantime. 

1) Check if there is an esri_auth cookie available for your domain:

  static getCookie(name: string) {
    const cookieArr = document.cookie.split(";");
    for(var i = 0; i < cookieArr.length; i++) {
      var cookiePair = cookieArr[i].split("=");
      if(name == cookiePair[0].trim()) {
        return decodeURIComponent(cookiePair[1]);
      }
    }
    return null;
  }

 

2a) If a cookie is available parse it and use the token in the registerToken Method like:

IdentityManager.registerToken({
   token: parsedCreds.token,
   server: this.sharingUrl
});

 

2b) If there is no cookie / token available, force the user to login and create a new oAuthInfo Object on the IdentityManager:

this.oAuthInfo = new OAuthInfo({
   appId: this.appId,
   portalUrl: esriConfig.portalUrl,
   popup: false,
   expiration: this.expiration
});
IdentityManager.registerOAuthInfos([this.oAuthInfo])

 

4) Check for sign-in-status ( if false request credentials)

IdentityManager.checkSignInStatus(this.sharingUrl).then(
      (creds) => {
        return Promise.resolve(creds)
      },
      () => {
        // Show login mask.
        return IdentityManager.getCredential(this.sharingUrl)
      }
    )

 

 

Not sure if this is the preferred way. For our usecases this seems to work. Maybe someone from Esri could put in their two cents.

View solution in original post

3 Replies
ReneRubalcava
Frequent Contributor

How are using the registerToken? Not exactly secure, but you could pass the token via URL to your sub-app, create a new credential with the token and register it. You'd need the serverInfo, maybe the expiration too in case the app stays open for days/weeks. I thought the tokens were stored at the root domain level, but maybe url specific.

by Anonymous User
Not applicable

We have successfully created credential caches that stores tokens along with their respective server domains in cookies and localStorage as a fallback.  We have a function we call in the entry point of our apps that listens for `IdentityManger.on('credential-create') that will update the cookie/localStorage when a user logs in.  This same function will also read the cookie or localStorage and iterate through the tokens and calls `IdentityManager.registerToken()` for each one.  This makes it so our users only have to log in once to multiple apps and the credentials persist until the tokens expire.

Bernd_Loigge
New Contributor III

@ReneRubalcava & @Anonymous User  - thanks for your suggestions. Both ideas look promising. I was able to find out a similar way in the meantime. 

1) Check if there is an esri_auth cookie available for your domain:

  static getCookie(name: string) {
    const cookieArr = document.cookie.split(";");
    for(var i = 0; i < cookieArr.length; i++) {
      var cookiePair = cookieArr[i].split("=");
      if(name == cookiePair[0].trim()) {
        return decodeURIComponent(cookiePair[1]);
      }
    }
    return null;
  }

 

2a) If a cookie is available parse it and use the token in the registerToken Method like:

IdentityManager.registerToken({
   token: parsedCreds.token,
   server: this.sharingUrl
});

 

2b) If there is no cookie / token available, force the user to login and create a new oAuthInfo Object on the IdentityManager:

this.oAuthInfo = new OAuthInfo({
   appId: this.appId,
   portalUrl: esriConfig.portalUrl,
   popup: false,
   expiration: this.expiration
});
IdentityManager.registerOAuthInfos([this.oAuthInfo])

 

4) Check for sign-in-status ( if false request credentials)

IdentityManager.checkSignInStatus(this.sharingUrl).then(
      (creds) => {
        return Promise.resolve(creds)
      },
      () => {
        // Show login mask.
        return IdentityManager.getCredential(this.sharingUrl)
      }
    )

 

 

Not sure if this is the preferred way. For our usecases this seems to work. Maybe someone from Esri could put in their two cents.