can't get legend to work w/ secured service....

877
5
Jump to solution
05-02-2014 02:20 PM
caseycupp
New Contributor III
I've been working in the javascript legend sandbox...

I've made a minor change to the sandbox code... my Unsecured Services show up in the map and the legend...

However, my secured services prompt me for the username and password, I manually enter them... then the service does show up in the map but not the legend...

http://developers.arcgis.com/javascript/sandbox/sandbox.html?sample=widget_legend



<!DOCTYPE html> <html> <head>   <meta http-equiv="Content-Type" content="text/html; charset=utf-8">   <!--The viewport meta tag is used to improve the presentation and behavior of the samples     on iOS devices-->   <meta name="viewport" content="initial-scale=1, maximum-scale=1,user-scalable=no">   <title>Map with legend</title>    <link rel="stylesheet" href="http://js.arcgis.com/3.9/js/dojo/dijit/themes/claro/claro.css">   <link rel="stylesheet" href="http://js.arcgis.com/3.9/js/esri/css/esri.css">    <style>     html, body {       height: 97%;       width: 98%;       margin: 1%;     }      #rightPane {       width: 20%;     }        </style> <script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>   <script src="http://js.arcgis.com/3.9/"></script>   <script>     var map;     require([       "esri/map", "esri/layers/FeatureLayer", "esri/dijit/Legend",       "dojo/_base/array", "dojo/parser",       "dijit/layout/BorderContainer", "dijit/layout/ContentPane",        "dijit/layout/AccordionContainer", "dojo/domReady!"     ], function(       Map, FeatureLayer, Legend,       arrayUtils, parser     ) {       parser.parse();        map = new Map("map", {         basemap:"topo",         center: [-96.53, 38.374],         zoom: 13       });         //add the legend       map.on("layers-add-result", function (evt) {         var layerInfo = arrayUtils.map(evt.layers, function (layer, index) {           return {layer:layer.layer, title:layer.layer.name};         });         if (layerInfo.length > 0) {           var legendDijit = new Legend({             map: map,             layerInfos: layerInfo           }, "legendDiv");           legendDijit.startup();         }       });                           $.get("https://maps2.petroweb.com/MAPS2ArcGISServer/tokens?request=getToken&username=pwuser&password=Mauser$98K&expiration=1440&client=http%20referer&referer=localhost")                     .done(function (data) {                                               var imageParameters = new esri.layers.ImageParameters();                         imageParameters.format = "png";                                                    var mapServiceURL = "http://mymapserver.com/MAPS2ArcGISServer/rest/services/MySecureService/MapServer/?token=" + data;                         //var mapServiceURL = "http://mymapserver.com/MAPS2ArcGISServer/rest/services/MyUnsecureService/MapServer/?token=" + data;                                                  var usWellsLayer = new esri.layers.ArcGISDynamicMapServiceLayer(mapServiceURL, { "opacity": 1, "imageParameters": imageParameters });                         map.addLayers([usWellsLayer]);                                            })                     .fail(function (xhr, textStatus, errorThrown) {                         alert("Failed to get us wells map layer security token.");                     });                 //map.addLayers([colorado]);     });   </script> </head>  <body class="claro">    <div id="content"        data-dojo-type="dijit/layout/BorderContainer"        data-dojo-props="design:'headline', gutters:true"        style="width: 100%; height: 100%; margin: 0;">           <div id="rightPane"          data-dojo-type="dijit/layout/ContentPane"          data-dojo-props="region:'right'">           <div id="legendDiv"></div>         </div>        <div id="map"          data-dojo-type="dijit/layout/ContentPane"          data-dojo-props="region:'center'"          style="overflow:hidden;">     </div>   </div> </body>  </html>
0 Kudos
1 Solution

Accepted Solutions
BenFousek
Occasional Contributor III
The legend widget doesn't like token appended service urls.

Once constructed the layer doesn't need the token query string anymore. Simply set the layer's url property w/o the token.

var layer = new Dynamic('http://some_url/some_service?token=some_token', {   //options }); layer.url = 'http://some_url/some_service'; map.addLayer(layer);

View solution in original post

0 Kudos
5 Replies
Noah-Sager
Esri Regular Contributor
Hi Casey,

I think the issue is that as soon as any layers in the map get loaded, the create legend widget method gets called. Thus, once you sign-in to display the secure layers, the legend is already complete.

I think you have two options moving forward:
1) Use the proxy page with your credentials so that all the layers (secure & non-secure) get loaded at once
2) Refresh the legend after the secure services get added using legend.refresh()

Hope this helps! Have a great weekend.

-Noah
0 Kudos
caseycupp
New Contributor III
I don't think I was clear.. the user should not have to sign in.

My current workflow

Without Legend
# 1 - Get Token
# 2 - append token to URL
# 3 - map.AddLayers
Happy Map

With Legend
# 1 - Get Token
# 2 - append token to URL
# 3 - map.AddLayers
# 4 - legendDijit.startup();  (The legend layer has the token at this point)
# 5 - map prompts user for sign in 😞



The user doesn't sign in..

In the chrome console debugger.. The legend has the token...and CORS is enabled on this server.

legendDijit.layerInfos[0].layer.url - "http://myarcgisserver.com/MAPS2ArcGISServer/rest/services/US_Wells/MapServer/?token=4-6f3b1Tseh_Yyfo...."
0 Kudos
Noah-Sager
Esri Regular Contributor
Hi Casey,

It sounds like a proxy would the most appropriate and secure workflow for your situation. I tested the legend dijit sample by adding a secure feature layer using the proxy page, and it worked fine.

Using the proxy: https://developers.arcgis.com/javascript/jshelp/ags_proxy.html

A few questions to consider:
How are you getting and appending the token in the code?
What event fires the legendDijit.startup() function?


-Noah
0 Kudos
BenFousek
Occasional Contributor III
The legend widget doesn't like token appended service urls.

Once constructed the layer doesn't need the token query string anymore. Simply set the layer's url property w/o the token.

var layer = new Dynamic('http://some_url/some_service?token=some_token', {   //options }); layer.url = 'http://some_url/some_service'; map.addLayer(layer);
0 Kudos
caseycupp
New Contributor III
Thanks, used btfou method and that worked.

casey
0 Kudos