Mixed content http calls made even though URL is https

[advancedits]

• Browser and version:

Chrome 51

• Version of Leaflet (L.version):

1.0.3

• Version of esri Leaflet (L.esri.VERSION):

2.0.8

Steps to reproduce the error:

We use HTTPS to show ArcGIS map service

 L.esri.dynamicMapLayer({
     url: "https://www.webapps.nwfsc.noaa.gov/arcgis/rest/services/FRAM/Regulatory_PFMC_Landmarks_MapCache/MapServer",
          opacity : 1,
          useCors: false
    });

What happens is [X]. However we kept getting mixed content warnings such as Mixed Content: The page at 'https://www.nwfsc.noaa.gov/data/map' was loaded over HTTPS, but requested an insecure image 'http://www.webapps.nwfsc.noaa.gov/arcgis/rest/directories/arcgisoutput/FRAM_Landmarks_MapCache_MapServer/_ags_map6500fbbc4c794478b8cb3715aae73491.png'. This content should also be served over HTTPS.

I was expecting [Y]. All leaflet and/or leaflet-esri functions to use the URL w/ HTTPS

For a workaround I modified the leaflet ImageOverlay by adding a string replace here:

https://github.com/Leaflet/Leaflet/blob/61ff641951fa64ba4730f71526988d99598681c8/src/layer/ImageOverlay.js#L197

I literally replace this._url with this._url.replace("http:","https:"); and that took care of the warning. What I don't understand is from the point that I make the initial call with HTTPS how did it get to a point where I was requesting an image with HTTP?

[jgravois]

some misconfiguration in the service itself is causing it to return an http resource url.

// 20170514084924
// https://www.webapps.nwfsc.noaa.gov/arcgis/rest/services/FRAM/Regulatory_PFMC_Landmarks_MapCache/MapServer/export?bbox=-1.5798200156582285E7%2C4597230.73647983%2C-1.1991061836917717E7%2C6236889.14827&bboxSR=&layers=&layerDefs=&size=&imageSR=&format=png&transparent=false&dpi=&time=&layerTimeOptions=&dynamicLayers=&gdbVersion=&mapScale=&f=pjson

{
  "href": "http://www.webapps.nwfsc.noaa.gov/arcgis/rest/directories/arcgisoutput/FRAM/Regulatory_PFMC_Landmarks_MapCache_MapServer/_ags_mapa2f88e7d623741248504f3d3e53dfd37.png"...

Your technique of altering it afterward is clever, but it'd be easier to just ask the service for an image { f: 'image' } instead of asking for a JSON payload that includes the url of the image to fetch.

That said, why aren't you taking advantage of the fact that the service has already been cached? Fetching pre-baked tiles is a lot faster than asking ArcGIS Server to create them on demand.

// 20170514085631
// https://www.webapps.nwfsc.noaa.gov/arcgis/rest/services/FRAM/Regulatory_PFMC_Landmarks_MapCache/MapServer?f=json

{ "singleFusedMapCache": true }

L.esri.tiledMapLayer({
    url: 'https://www.webapps.nwfsc.noaa.gov/arcgis/rest/services/FRAM/Regulatory_PFMC_Landmarks_MapCache/MapServer'
}).addTo(map);

ref: #952

[advancedits]

Thanks @jgravois for pointing out the misconfiguration in the service. I'll check with the folks making the service to resolve that.

As far as caching, in our map (since we have about 8 arcGIS maps), I store them in javascript variables and if the layer gets unselected and selected again, I don't call the URL but instead add the layer to the map as follows.

            if( node.data.layer  != null )
                         map.addLayer(node.data.layer );
                    else
                    {
                        node.data.layer = L.esri.dynamicMapLayer({
                          url: node.data.url,
                          opacity : 1,
                            useCors: false
                        });

                        map.addLayer(node.data.layer);
                        storeArcGISLayer(node);

                    }

Does the strategy you are suggesting apply to us? I'm not sure where I would incorporate "singleFusedMapCache". Should I not use L.esri.dynamicMapLayer but use L.esri.tiledMapLayer? We need the ability to let the user turn on and off the layer.

One last question, do you have any suggestion why our "PFMC Landmarks" layer would take 2 minutes to load whereas another "Station Grid" loads almost instantly? Here's our app: https://www.nwfsc.noaa.gov/data

[jgravois]

Does the strategy you are suggesting apply to us?

the short answer is yes. tiledMapLayers can be added and removed from the map just as easily as other layer types.

as the developer its up to you to determine whether a cache is present for a particular map service before attempting to leverage the cache to speed up display. in your situation you could just visit the metadata page for each of your eight services manually, determine whether { singleFusedMapCache: true } and set a corresponding variable in JS to identify what layer type would be most appropriate before you add it to the map.

in situations where you're confronted with a previously completely unknown service, developers can send off a metadata request programmatically.

const serviceUrl = 'https://www.webapps.nwfsc.noaa.gov/arcgis/rest/services/FRAM/Regulatory_PFMC_Landmarks_MapCache/MapServer/';
L.esri.request(serviceUrl, {}, function (error, response) {
    if (response.singleFusedMapCache); {
        L.esri.tiledMapLayer(/**/).addTo(map);
    } else {
        L.esri.dynamicMapLayer(/**/).addTo(map);
    }
});

do you have any suggestion why our "PFMC Landmarks" layer would take 2 minutes to load

i don't know why, but that service is taking way too long to respond to an export/ request. you're lucky a tile cache is present. :smile:

[advancedits]

Thank you @jgravois that's very helpful. Please bare with me as I'm new to the mapservice world. :)

So I checked and the particular layer that is slow to export https://www.webapps.nwfsc.noaa.gov/arcgis/rest/services/FRAM/Regulatory_PFMC_Landmarks_MapCache/MapServer/ does have singleFusedMapCache set to true.

However when I used tiledMapLayer, I got a bunch of tile 404 errors. Now does that mean an issue on the MapService side?

We are having trouble understanding why the layer loads instantly on arcgis.com but takes a long time to respond on our application http://www.arcgis.com/home/webmap/viewer.html?url=http%3A%2F%2Fwww.webapps.nwfsc.noaa.gov%2Farcgis%2Frest%2Fservices%2FFRAM%2FRegulatory_PFMC_Landmarks_MapCache%2FMapServer&source=sd

So is it our use of leaflet or the map service?

[jgravois]

the layer loads instantly on arcgis.com

if you snoop the web traffic you'll see that this is because the arcgis.com map viewer is fetching cached tiles.

when I used tiledMapLayer, I got a bunch of tile 404 errors

this is happening because this map service cache has only been created for the west coast of the continental US and the arcgis.com map viewer employs some internal logic to only request tiles that actually exist.

in Leaflet you could either live with the 404s, restrict the map extent artificially, or try and get clever and remove the layer programmatically when folks pan to locations where no cached tiles are available.

[advancedits]

Do I need to add logic prior to calling tiledMapLayer or dynamicMapLayer to request tiles that exist? If possible, worst case, I can just catch the 404 exceptions and do nothing but I'm not sure where that code even lives. Is it prior to calling leaflet or in the Leaflet code?

Appreciate all your help guiding us through this stuff :)

[jgravois]

I can just catch the 404 exceptions

just to be clear, this library already swaps in a transparent image automatically when a 404 is encountered (see https://github.com/Esri/esri-leaflet/pull/902).

you're welcome to implement my other suggestions above, or any additional clever thing you want, but we don't bother in our own sample. you can see this by panning over to a blank blue area and zooming in to level 10.

[advancedits]

I see, so even though the library swaps in a transparent image automatically , the dev console will still spit out the 404s? I just wanted to keep the dev console clean by catching it so it doesn't get shown in the dev console.

[jgravois]

so even though the library swaps in a transparent image automatically , the dev console will still spit out the 404s?

yes.

I just wanted to keep the dev console clean

i empathize with you. good luck! :tractor:

[advancedits]

Sorry, not intending to reopen this issue but regardless of my panning or zooming, after I see all the 404s, I don't see the layer or any images added to my map. I understand the 404s can be ignored and replaced with transparent images but regardless of my zooming/panning the map, I don't see anything. Any thoughts? :)

Here's another one I tested with https://www.webapps.nwfsc.noaa.gov/arcgis/rest/services/FRAM/AcousticsSurvey_HakeAdult_NASC_Summer2012_MapCache/MapServer/

Same issue. It's almost like dynamicMapLayer is the only way to display these.

[jgravois]

no need to apologize, but i can't reproduce the problem you're describing. http://jsbin.com/hicecid/edit?html,output

[advancedits]

So looks like the reason it's hidden for us it's because we are using multiple base map layers with a control. For example http://jsbin.com/zoculadiri/1/edit?html,output

But try to use the control icon on the top left and switch base map layer, then the layer gets hidden. Is there a way to use the control with multiple base layers and tiledMapLayer so that upon changing base layers the map service doesn't disappear? If I switch from tiledMapLayer to dynamicMapLayer then the map service shows even after changing base layer.

I'm using the addLayer and removeLayer options based on when a user checks the icon for a particular layer. So I can't use the ".addTo(map)"

[advancedits]

It does work if we only use one basemap but multiple basemaps seems to have a layer order issue as shown here http://jsbin.com/zoculadiri/1/edit?html,output

when you switch basemaps. The default settings of the control looks ok to me as far as the sort order.

[jgravois]

you can get more fine-grained control over layer order (and solve this problem) by implementing a custom Map pane.

http://jsbin.com/jeyoha/1/edit?html,output

[advancedits]

Excellent, that looks like exactly what we need.

[geoffreyjoseph]

@advancedits Did you ever find the reason your service was returning 'http' instead of 'https'? I am experiencing the same issue. Thanks

[makahmad]

Unfortunately no. I don't deal with the map configuration but it sounds like from John that may be the issue