Authenticate with an API key

Authenticate with an API key

View members in your organization using an API key

An Application Programming Interface key (API key) is a long-lived access token that defines the scope and permission for granting a public-facing application access to ready-to-use services. With ArcGIS REST JS, you use the ApiKeyManager class to set your API key before accessing services.

In this tutorial, you create and configure an access token to view members in your organization.

Prerequisites

Steps

Create a new app

Create a new CodePen app with a <pre> element that is the full width and height of the browser window.

  1. Go to CodePen and create a new pen for your application.

  2. In CodePen > HTML, add HTML and CSS to create a page with a <pre> element called result.

    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
    
    <!DOCTYPE html>
    <html>
    
    
    <head>
      <meta charset="utf-8" />
      <meta name="viewport" content="width=device-width" />
      <title>ArcGIS REST JS</title>
    
      <style>
        body {
          font-family: monospace;
          color: white;
          background: #000000;
        }
    
        pre {
          overflow: auto;
          padding: 1rem;
          background: #000000;
        }
      </style>
    </head>
    
    
    <body>
      <pre id="result"></pre>
    
    </body>
    
    </html>

Set up authentication

Create a new with the correct privileges to access the resources used in this tutorial.

  1. Go to the Create an API key tutorial and create an with the following :
    • Privileges:
      • General privileges > Members > View
  2. Copy the API key access token to your clipboard when prompted.

Set developer credentials

  1. Add references to the arcgis-rest-request library. The library contains request/response processing, authentication helpers, and error handling.

    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
    
    <head>
      <meta charset="utf-8" />
      <meta name="viewport" content="width=device-width" />
      <title>ArcGIS REST JS</title>
    
      <script src="https://unpkg.com/@esri/arcgis-rest-request@4/dist/bundled/request.umd.js"></script>
    
  2. Create an accessToken variable and set its value to your . Create an authentication variable that will call the fromKey method to create an instance of ApiKeyManager.

    Expand
    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
      <script>
        const accessToken = "YOUR_ACCESS_TOKEN";
    
        const authentication = arcgisRest.ApiKeyManager.fromKey(accessToken);
    
    Expand

Search for members in the organization

  1. Define a url variable and assign it the portal URL where the request will be sent.

    Expand
    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
      <script>
        const accessToken = "YOUR_ACCESS_TOKEN";
    
        const authentication = arcgisRest.ApiKeyManager.fromKey(accessToken);
    
        const url = "https://www.arcgis.com/sharing/rest/community/users"
    
      </script>
    
    Expand
  2. Use the request function to retrieve a list of users in your organization whose names contain the text john. Provide the search parameters q: "john" in the request options to filter the results. Then, print out the JSON result.

    Expand
    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
      <script>
        const accessToken = "YOUR_ACCESS_TOKEN";
    
        const authentication = arcgisRest.ApiKeyManager.fromKey(accessToken);
    
        const url = "https://www.arcgis.com/sharing/rest/community/users"
    
        arcgisRest.request(url, {
          authentication,
          params: {
            q: "john", // The query string to search the users against
            f: "json"
          }
        }).then(response => {
          document.getElementById("result").textContent = JSON.stringify(response, null, 2);
        })
    
      </script>
    
    Expand

Run the app

Run the app.

The result should look similar to this.

What's next?

Learn how to use additional ArcGIS location services in these tutorials:

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

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