How to Access Secured ArcGIS Server Map Service?

832
4
04-01-2021 01:17 AM
ZohaibUddinKhan
New Contributor II

Hello Everyone,

Thanks for reading my post.

We're using JS API to access the secured service and we're expecting it wouldn't ask for the user credentials as we're passing Token, but it's not working as expected and asking for credentials.

Following is the code:-

 

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
    <meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no" />
    <title></title>
    <style>
        html,
        body,
        #viewDiv {
            padding: 0;
            margin: 0;
            height: 100%;
            width: 100%;
        }
    </style>
    <link rel="stylesheet" href="https://js.arcgis.com/4.18/esri/themes/light/main.css">
    <script src="https://js.arcgis.com/4.18/"></script>
    <script>
        require(["esri/config", "esri/Map", "esri/views/MapView", "esri/layers/FeatureLayer"], function (esriConfig, Map, MapView, FeatureLayer) {

            esriConfig.apiKey = "AAPK9c1060b46848481f85233a3e7-Bf1Yng_hEZz";

            const map = new Map({
                basemap: "arcgis-topographic" // Basemap layer service
            });

            const view = new MapView({
                map: map,
                center: [115.860299, -31.954594], // Longitude, latitude
                zoom: 13, // Zoom level
                container: "viewDiv" // Div element
            });

            const featureLayerUrl = "https://services.slip.wa.gov.au/arcgis/rest/services/Landgate_v2_Subscription_Services/Cadastral/MapServer/41";
            //const featureLayerUrl = "https://token.slip.wa.gov.au/arcgis/rest/services/Landgate_v2_Subscription_Services/Cadastral/MapServer/41";

            var layer = new FeatureLayer({
                url: featureLayerUrl,                
                customParameters: {
                    "token": "nXKRnEHxOLrfCyV_209zi9ht45yzP-IIrvjZzsrI."//Get the token from https://token.slip.wa.gov.au/arcgis/tokens/
                }
            });

            map.add(layer);
        });
    </script>    
</head>
<body>
    <div id="viewDiv"></div>
</body>
</html>

 

 

0 Kudos
4 Replies
BlakeTerhune
MVP Regular Contributor

You cannot reuse the same token like that. You have to generate a token when the app loads and gets user credentials. You could also consider application authentication if you don't want to get credentials from each user.

ZohaibUddinKhan
New Contributor II

Thanks @BlakeTerhune for the reply.

  1. Is there any other way apart from  application authentication if I don't want to get credentials from each users?
  2. I changed my code and now generating the Token in the code like below and CORS is the challenge I'm facing now. Any suggestion?:-
<script>
        function getToken() {

            var settings = {
                "url": "https://token.slip.wa.gov.au/arcgis/tokens/generateToken",
                "method": "POST",
                "timeout": 0,
                "headers": {
                    "Content-Type": "application/x-www-form-urlencoded"
                },
                "data": {
                    "username": "username@domain.com",
                    "password": "678965",
                    "client": "referer",
                    "ip": "",
                    "referer": "https://www.domain.com/",
                    "expiration": "60",
                    "f": "json"
                },
                async: false
            };

            return $.ajax(settings).done().responseText;

        }
        console.log('1');
        var result = getToken();
        var token1 = $.parseJSON(result).token;

        require(["esri/config", "esri/Map", "esri/views/MapView", "esri/layers/FeatureLayer"], function (esriConfig, Map, MapView, FeatureLayer) {

            esriConfig.apiKey = "AAPK9c1060b46848481f85233a3e-_hEZz";

            const map = new Map({
                basemap: "arcgis-topographic" // Basemap layer service
            });

            const view = new MapView({
                map: map,
                center: [115.860299, -31.954594], // Longitude, latitude
                zoom: 13, // Zoom level
                container: "viewDiv" // Div element
            });

            const featureLayerUrl = "https://services.slip.wa.gov.au/arcgis/rest/services/Landgate_v2_Subscription_Services/Cadastral/MapServer/41";
            //const featureLayerUrl = "https://token.slip.wa.gov.au/arcgis/rest/services/Landgate_v2_Subscription_Services/Cadastral/MapServer/41";

            var layer = new FeatureLayer({
                url: featureLayerUrl,
                customParameters: {
                    "token": token1
                }
            });

            map.add(layer);

        });
    </script>

This is the Cors challenge:-

Esri-Token-Cors.PNG

Thanks for your time.

0 Kudos
BlakeTerhune
MVP Regular Contributor

CORS is always a challenge. Have a look at the documentation to see if you can identify the solution for your particular setup. The easiest (but not always most reasonable) solution is to run your app from the same server as your services.

0 Kudos
MarkEastwood
Occasional Contributor

Any luck getting this to work?

0 Kudos