topic Re: Use the BeginOAuth2 without a popup in ArcGIS REST JS Questions

Use the BeginOAuth2 without a popup

AgnieszkaRozniak — Fri, 19 Mar 2021 13:58:00 GMT

I am trying to include user authentication into a webpage. I want to use `BeginOAuth2` method from the rest-js library.

I have found some examples with the property `popup` set to `true`, for example, https://github.com/Esri/arcgis-rest-js/tree/master/demos/oauth2-browser

I do not want to redirect the user to any other site, just open the authentication in the same window and then go back to the original page (storing the obtained token in the local storage). However, I can't figure out how to deal with the `redirect uri` in those settings. Do you have any exemplary code snippets which deal with the `popup` set to false? Also, do I also need to use the `CompleteOAuth2` method to get the token?

Re: Use the BeginOAuth2 without a popup

GavinRehkemper — Thu, 25 Mar 2021 22:50:09 GMT

Hi, have you tried setting the "popup" property to false in the example (here)? I think that should work fine - let us know if it's not working and we can try to fix.

Your redirect URI will be the page that has CompleteOauth2 function call in it - in the sample, that is called here.

Re: Use the BeginOAuth2 without a popup

AgnieszkaRozniak — Fri, 26 Mar 2021 07:16:20 GMT

Hi, @GavinRehkemper and thank you for your reply. Yes, I have set the "popup" property to false based on the examples you linked. I am not sure if I was clear enough with my explanation so let me ask again. How can I use the OAuth2 without using the authenticate file? Can I implement the authentication in a single script? How do I deal with the `completeOAuth2` method then?

Re: Use the BeginOAuth2 without a popup

GavinRehkemper — Fri, 26 Mar 2021 14:36:44 GMT

Hi, yes you can do that. Simply move the arcgisRest.UserSession.completeOAuth2() call into the main page. The key is to detect if you're in the state where the access_token has been passed by the URL. One way to do it would be something like this:

// Define a global session variable. let session = null; // ADDED: --------------------------------- const clientIdFromURL = new URLSearchParams(window.location.search).get('clientID'); const parsedHash = new URLSearchParams( window.location.hash.substr(1) // skip the first char (#) ); var accessTokenFromURL = parsedHash.get('access_token'); // only call completeOAuth2 if we have the clientID and access token: if(clientIdFromURL && accessTokenFromURL) { session = arcgisRest.UserSession.completeOAuth2({ clientId: clientIdFromURL, }); localStorage.setItem('__ARCGIS_REST_USER_SESSION__', session.serialize()); } // END ADDED SECTION: --------------------------------- // Check to see if there is a serialized session in local storage. const serializedSession = localStorage.getItem('__ARCGIS_REST_USER_SESSION__');

If you do this, the thing to think about would be: since you're not doing the "redirect via authenticate.html" thing, the access_token is right in the URL bar:

which is not ideal, security-wise. So I would recommend using some JavaScript to remove that.