Access a secure webmap using OAuth 2.0

This sample shows how to display a secure webmap using OAuth 2.0 authentication and the IdentityManager. The IdentityManager provides built-in functionality to support the authentication process.

How it works

First, register an application with your ArcGIS organization to get an application ID. This ID is used to authenticate your application with the ArcGIS platform. See the OAuth credentials documentation or the tutorial for additional detailed information about registering an application.

Create an OAuthInfo object and specify the application ID you received when registering your application. This must be done before the map components are loaded. After this is set, pass this OAuthInfo object to the IdentityManager's registerOauthInfos method and the IdentityManager takes care of the rest.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
        const oAuthInfo = new OAuthInfo({
          // Replace with your actual App ID
          appId: "APP_ID"
          // Set the portalUrl if using a portal other than ArcGIS Online.
          //portalUrl: esriConfig.portalUrl
        });
        esriId.registerOAuthInfos([oAuthInfo]);

Add an arcgis-map component and set the item-id attribute to a secure webmap. Add an arcgis-search and arcgis-legend component to the map.

1
2
3
4
<arcgis-map item-id="SECURE_WEBMAP_ID">
  <arcgis-search position="top-right"></arcgis-search>
  <arcgis-legend position="bottom-left"></arcgis-legend>
</arcgis-map>

Please see the authentication documentation for additional detailed information about and OAuth 2.0. In addition, please refer to the ArcGIS Organization portals for more information on authentication.

For a similar example using ESM, see this GitHub sample.

Your browser is no longer supported. Please upgrade your browser for the best experience. See our browser deprecation post for more details.

The developer dashboard has moved

You can no longer sign into this site. Go to your ArcGIS portal or the ArcGIS Location Platform dashboard to perform management tasks.

Your ArcGIS portal

Create, manage, and access API keys and OAuth 2.0 developer credentials, hosted layers, and data services.

Your ArcGIS Location Platform dashboard

Manage billing, monitor service usage, and access additional resources.

Learn more about these changes in the What's new in Esri Developers June 2024 blog post.

Close