A RetroSearch Logo

Home - News ( United States | United Kingdom | Italy | Germany ) - Football scores

Search Query:

Showing content from https://developers.arcgis.com/arcgis-rest-js/authentication/tutorials/authenticate-with-an-api-key/ below:

Authenticate with an API key | ArcGIS REST JS

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.

Security and authentication guide

To learn more about different types of authentication, go to How to use authentication.

Prerequisites

An ArcGIS Location Platform, ArcGIS Online, or ArcGIS Enterprise account.

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.

    Use the HTML to create a page with a map. Use the map div to display the map. Use the CSS to make the map full width and height.

    The <!DOCTYPE html> tag is not required in CodePen. If you are using a different editor or running the page on a local server, be sure to add this tag to the top of your HTML page.

    Use dark colors for code blocks

    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 API key credential with the correct privileges to access the resources used in this tutorial.

  1. Go to the Create an API key tutorial and create an API key with the following privilege(s):
  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.

    Use dark colors for code blocks

    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 API key. Create an authentication variable that will call the fromKey method to create an instance of ApiKeyManager.

    Expand

    Use dark colors for code blocks
    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);
    
Search for members in the organization
  1. Define a url variable and assign it the portal URL where the request will be sent.

    Expand

    Use dark colors for code blocks
    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>
    
  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

    Use dark colors for code blocks
    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>
    
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:


RetroSearch is an open source project built by @garambo | Open a GitHub Issue

Search and Browse the WWW like it's 1997 | Search results from DuckDuckGo

HTML: 3.2 | Encoding: UTF-8 | Version: 0.7.4