2

I'm using IdentityManager to access secured resources (using ArcGIS tokens). There were no issues while I was using portal items like this:

const webMap = new WebMap({
  portalItem: {
    id: 'some-portal-id'
  }
});

But recently I tried to add base maps and the requests were ending up with 401:

const webMap = new WebMap({
  basemap: {
    style: {
      language: 'nl',
      id: 'arcgis/dark-gray',
      serviceUrl: `https://basemapstyles-api.arcgis.com/arcgis/rest/services/styles/v2/styles`
    }
  }
});

Request ended up in 401 due to token absence

If I add that token (ArcGIS token from IdentityManager) manually to the URL there are no issues

The same request, but with a token

Is there a way to specify a token when creating a basemap instance? Or make it use IdentityManager anyhow?

The package I'm using is "@arcgis/core": "^4.28.10"

1 Answer 1

1

You can use esriConfig.apiKey for authentication (see https://developers.arcgis.com/javascript/latest/api-reference/esri-config.html#apiKey).

Here is an example of how it is used:

require([
    "esri/config",
    "esri/Map",
    "esri/views/MapView",
    "esri/widgets/ScaleBar",
    "esri/widgets/Sketch",
    "esri/Graphic",
    "esri/layers/GraphicsLayer",
    "esri/geometry/geometryEngine",
    "esri/Basemap",
    "esri/core/reactiveUtils"
], (esriConfig, Map, MapView, ScaleBar, Sketch, Graphic, GraphicsLayer, geometryEngine, Basemap, reactiveUtils) => {
    esriConfig.apiKey = "AAPKe1c05b9485c44780824e587fe012a020tUuqQMozRdQZiJa_DA9xrDKX6I5Dsl7F9KurI89k2tGEKbfrfdpoX6ek8Kh0rqIf";



    const graphicsLayer = new GraphicsLayer();

    const map = new Map({
        basemap: new Basemap({
            portalItem: {
                id: "979c6cc89af9449cbeb5342a439c6a76"  // Light Gray Canvas
            }
        }),
        layers: [graphicsLayer]
    });

    const view = new MapView({
        container: "viewDiv",
        map: map,
        center: [-75.056, 38.540], // Longitude, latitude
        zoom: 5 // Zoom level
    });

    var currZoom = null;
    
    const handle = reactiveUtils.watch(
      () => [view.stationary, view.zoom],
      ([stationary, zoom]) => {
        if(stationary && (zoom != currZoom)){
          currZoom = zoom;
          console.log(`Change in zoom level: ${zoom}`);
        }
       }
    );

    const sketch = new Sketch({
        layer: graphicsLayer,
        view: view,
        // graphic will be selected as soon as it is created
        creationMode: "update",
        availableCreateTools: ["polygon", "rectangle"],
        updateOnGraphicClick: true,
        visibleElements: {
            createTools: {
                point: false,
                circle: false
            },
            selectionTools: {
                "lasso-selection": false,
                "rectangle-selection": false,
            },
            settingsMenu: false,
            undoRedoMenu: false
        }
    });
    sketch.on(["update"], onGraphicUpdate);
    
    function onGraphicUpdate(evt) {
      var feature = Terraformer.ArcGIS.parse(evt.graphics[0]);
      var wkt = Terraformer.WKT.convert(feature.geometry);
      console.log(wkt);
    }

    view.ui.add(sketch, "top-right");

    const scalebar = new ScaleBar({
        view: view,
        unit: "metric"
    });
    view.ui.add(scalebar, "bottom-right");

    const measurements = document.getElementById("measurements");
    view.ui.add(measurements, "manual");
});
2
  • Thanks @TomazicM, I'm aware that it's possible to use API key to achieve it, but it's a hard requirement to use ArcGIS token. For now, I'm using a webmap that contains a basemap I want to use. I just wanted to know if it's possible to skip that webmap as a mediator Feb 7 at 10:58
  • I'm not some ArcGIS expert, so I can't help you any further.
    – TomazicM
    Feb 7 at 11:46

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.