[GIS] Implementing app login in custom web app

arcgis-onlineauthentication

I created map, web mapping application on ArcGIS Online and wanted to access map using this app (but app hosted on my server using app login).
We can create web application using many default template on ArcGIS Online. we can also download source code of these JavaScript applications and can host them on own servers.

But I am not able to find any example which can guide me to modify app code to use app login.

I already know following steps:

  • Register the app and get client id (app id)/client secret (app secret)
  • Using POST request get access token from https://www.arcgis.com/sharing/rest/oauth2/token/
  • What next? Not sure
  • How to modify code in my downloaded app to access map?
  • Downloaded app folder structure

enter image description here

@heather-zerbe-gonzago helped but I am still not successful running my map.
I am using web application created by App builder and hosted it on own server. I have changed below files and using https://github.com/Esri/resource-proxy

Proxy.config
enter image description here
Config.json
enter image description here

Getting error {"error":{"code":400,"message":"Unable to generate token","details":["Unable to generate token for this server"]}} while hitting exchangePortalTokenForServerToken method in proxy.ashx file
enter image description here

I am able to resolve the above issue and come across another one.
I am trying to access ArcGIS Online Map using web builder generated app hosted on own servers.

I am getting below error
code:498
details:[]
message :"Invalid Token"
while app hits url
https://***/arcgisdev/proxy.ashx?https://services.arcgisonline.com/ArcGIS/rest/services/World_Topo_Map/MapServer?f=json

Best Answer

Probably the easiest way is to let a proxy handle this for you. For example, once you register your app, you can then copy and paste the clientId and secret into your proxy file. If you specify a proxy within your application, it will route the POST request via the proxy using the specified credentials from this registered app.

We actually use this in a few of our samples that require user logins to access hosted services off of AGO. Take a look at the Directions sample here, https://developers.arcgis.com/javascript/3/jssamples/widget_directions_basic.html, specifically take note of the line 

 //all requests to route.arcgis.com will proxy to the proxyUrl defined in this object.
    urlUtils.addProxyRule({
      urlPrefix: "route.arcgis.com",
      proxyUrl: "/sproxy/"
    });
    urlUtils.addProxyRule({
      urlPrefix: "traffic.arcgis.com",
      proxyUrl: "/sproxy/"
    });

The proxyUrl should point to a secured proxy on your web server. You can download this at https://github.com/Esri/resource-proxy. You will need to modify the proxy.config file with the credentials from your registered app. Specifically, take note of clientId and clientSecret. (README.md#proxy-configuration-settings)

Related Question