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>
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.
Thanks @BlakeTerhune for the reply.
<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:-
Thanks for your time.
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.
Any luck getting this to work?
has anyone found a solution to this issue?