I am following this tutorial in order to add vector tiles using geoserver and OL3. I am using some layer from a remote geoserver which I have access:
var layer = 'myworkspace:arm_trs_roads_osm';
var projection_epsg_no = '4326';
var vectorLayer = new ol.layer.VectorTile({
style:style_simple,
source: new ol.source.VectorTile({
tilePixelRatio: 1, // oversampling when > 1
tileGrid: ol.tilegrid.createXYZ({maxZoom: 19}),
format: new ol.format.MVT(),
url: 'http://ogcserver.gis.wfp.org/geoserver/gwc/service/tms/1.0.0/' + layer +
'@EPSG%3A'+projection_epsg_no+'@pbf/{z}/{x}/{-y}.pbf',
crossOrigin: null
})
})
When I try to display the layer on the map I get the well known CORS error:
Failed to load http://ogcserver.gis.wfp.org/geoserver/gwc/service/tms/1.0.0/my_workspace:arm_trs_roads_osm@EPSG%3A4326@pbf/3/0/4.pbf: No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://vagrant-test.local.com' is therefore not allowed access. The response had HTTP status code 404.
I am not sure how to solve this issue. I found this question which says to enable CORS in the tomcat level. But it also says that this feature is available after tomcat 7.0.41 (I have 7.0.39; not possible to upgrade currently).
I have also enabled JSONP in my geoserver config files. But still I get the same error. Which other alternative do I have?