Can't align TMS on OpenLayers Map

Question

I would like to add this TMS layer as my baseLayer. You can see the layer specs here

I am doing like this to create the layer:

var tmsLayer = new OpenLayers.Layer.TMS(
    "Gouvernement du Quebec",
    "http://pregeoegl.msp.gouv.qc.ca/cgi-wms/mapcache.fcgi/tms/",
   { layername: 'carte_gouv_qc_public@EPSG_3857', 
     type: "png", 
     serviceVersion:"1.0.0",
     gutter:0,
     buffer:0,
     isBaseLayer:true,
     tileOrigin: new OpenLayers.LonLat(-20037508.342789,-20037508.342789),
     numZoomLevels: null,
     maxZoomLevel: 16,
     minZoomLevel: 4,     
     zoomOffset:0,
     animate: true,
     visibility: true,
     transitionEffect: 'null',
     units:"m",
     maxExtent: new OpenLayers.Bounds(-20037508.342789,-20037508.342789,20037508.342789,20037508.342789),
     projection: new OpenLayers.Projection("EPSG:3857".toUpperCase()),
     sphericalMercator: true
     }
  );

As I am using an API that automatically create OpenLayers Map, I can't create the map myself but I use to modify it after loaded. I know that sucks, but you can see the map object definition in the console from this web site: https://carto48dev.mels.gouv.qc.ca/Infogeo/test/wms.html

What is the cause of the misalignment between the TMS layer and the map?

Answer 1

When inspecting your sample url, I see that tiles called are coming from https://pregeoegl.msp.gouv.qc.ca/cgi-wms/mapcache.fcgi/tms/1.0.0/carte_gouv_qc_public@EPSG_3857/4/13/28.png.

I should be able to make a getCapabilities request (see http://mapserver.org/mapcache/services.html to understand how I deduced it) with https://pregeoegl.msp.gouv.qc.ca/cgi-wms/mapcache.fcgi/tms/1.0.0/ and I don't get anything except an error.

IMO, your problem is on server side not on OpenLayers side. It can come from network issue, a mapcache misconfiguration or a configuration issue at Apache level (previous url send back a 403 error Forbidden. You don't have permission to access /cgi-wms/mapcache.fcgi/tms/1.0.0/ on this server.system issue)

Edit, due to feedback, the issue is not the server at the end.

Try code below on your sample in the console: it works but I removed some constraints (I think main issue = no resolution on your code side)

olmap.removeLayer(tmsLayer);

var tmsLayer = new OpenLayers.Layer.TMS( "Gouvernement du Quebec",
  "http://pregeoegl.msp.gouv.qc.ca/cgi-wms/mapcache.fcgi/tms/", {
    layername: 'carte_gouv_qc_public@EPSG_3857',
    type: "png",
    serviceVersion:"1.0.0",
    gutter:0,
    buffer:0,
    isBaseLayer:true,
    transitionEffect:'resize',
    tileOrigin: new OpenLayers.LonLat(-20037508.342789,-20037508.342789),
    resolutions:[156543.03392804099712520838,78271.51696402048401068896,39135.75848201022745342925,19567.87924100512100267224,9783.93962050256050133612,4891.96981025128025066806,2445.98490512564012533403,1222.99245256282006266702,611.49622628141003133351,305.74811314070478829308,152.87405657035250783338,76.43702828517623970583,38.21851414258812695834,19.10925707129405992646,9.55462853564703173959,4.77731426782351586979,2.38865713391175793490,1.19432856695587897633,0.59716428347793950593],
    zoomOffset:0,
    units:"m",
    maxExtent: new OpenLayers.Bounds(-20037508.342789,-20037508.342789,20037508.342789,20037508.342789),
    projection: new OpenLayers.Projection("EPSG:900913".toUpperCase()),
    sphericalMercator: true
  }
);
olmap.addLayer(tmsLayer);

For resolutions, I reused this tip but it's also possible to get them directly from MapCache config code. Resolutions on client and server side should be the same. This rule only true for Spherical Mercator because fixed parameters.