Tiles on SSL website loading over http

DennisHunink

Hi There,
I have an application on a SLL domain. Loading all the ArcGIS Javascript files is correctly done over https. But when actually using the application, the tiles of the basemap are loaded over http, resulting in security warnings in firefox en chrome. You can see it working at https://topografieindeklas.nl/topotrainer/nederland/. See the screenshot in the attachment for the errors displayed in firefox.

EDIT: When reproducing the error it's possibly easier to force this page over https: https://topografieindeklas.nl/SSLtest.php

Edit2: from there, it becomes more clear where things go wrong. Looking at the JSON url, the tile sub-servers are having http instead of https!

The code would be as basic as this (note this is Legacy; AMD style makes no difference):

<link rel="stylesheet" href="https://js.arcgis.com/3.7/js/dojo/dijit/themes/claro/claro.css">
<link rel="stylesheet" href="https://js.arcgis.com/3.7/js/esri/css/esri.css">
<script type="text/javascript" src="https://js.arcgis.com/3.7/"></script>
<style type="text/css">
#map{
  box-shadow:0 1px 3px rgba(0,0,0,0.5);
  -moz-box-shadow:0 1px 3px rgba(0,0,0,0.5);
  -webkit-box-shadow:0 1px 3px rgba(0,0,0,0.5);
  border:1px solid #CDCDCD;
 
}</style>
<script>
dojo.require("esri.map");
dojo.require("esri.layers.FeatureLayer");
dojo.require("esri.tasks.query");
dojo.require("dijit.layout.BorderContainer");
dojo.require("dijit.layout.ContentPane");
function createMap(){
  var basemapURL="https://tiles.arcgis.com/tiles/nSZVuSZjHpEZZbRo/arcgis/rest/services/Topografie_in_de_klas_nederland_ondergrond/MapServer";
  var map=new esri.Map("map",{zoom:7,center:[5.12,52.30]});
  map.addLayer(new esri.layers.ArcGISTiledMapServiceLayer(basemapURL));
  var infoTemplate=new esri.InfoTemplate("${NAME}",'Provincie <a href="https://topografieindeklas.nl/wp-content/themes/topografieindeklas/topotrainer/nederland/${Provincie}">${Provincie} oefenen</a>');
  contentFeatureLayer=new esri.layers.FeatureLayer('https://services.arcgis.com/nSZVuSZjHpEZZbRo/ArcGIS/rest/services/Topografie_in_de_klas_nederland/FeatureServer/0',
   {mode:esri.layers.FeatureLayer.ON_DEMAND,
   outFields:["*"],infoTemplate:infoTemplate});
   contentFeatureLayer.setDefinitionExpression("Type='Provincie'");
   map.addLayer(contentFeatureLayer);
   dojo.connect(map,"onLoad",function(){
     dojo.connect(map,"onMouseOver",map,"reposition");
     map.infoWindow.resize(200,100);});
   dojo.connect(contentFeatureLayer,"onMouseOver",function(evt){
     map.setMapCursor("pointer");});
   dojo.connect(contentFeatureLayer,"onMouseOut",function(evt){
     map.graphics.clear();
     map.setMapCursor("default")});
   return map;
}
dojo.ready(createMap);
</script>
<div id="mainMapWindow" dojotype="dijit.layout.BorderContainer" design="headline" gutters="false" >
<div id="map" dojotype="dijit.layout.ContentPane" region="center" ></div></div>

What could be causing the tiles being loaded over http, while the rest of the page is loaded over https?

Schermafbeelding 2013-12-30 om 11.17.30.png

fillerror_facc.jpg

ThomasGoodridge_2-1723736073756.png

JamesVillanueva

I had the same issue on my project. In the end, I did the following:

- Setup a proxy page
- Set the proxy page in the esriconfig
- Waited for the tile layer to load, once it did, there was a list of tileServers as a property on the layer
- Set each one of the tile servers as a proxy rule if they begin with http

This sent all those http requests through my server and resolved the issues with mixed content. Hope that helps.