CODEWITHSUNDEEP
openlayers-3cesiumjs
Francois Prunayre
Francois Prunayre

Reputation: 11

Proxy for WMS layers

Building an app with ol-cesium, depending on the WMS, Cross-Origin errors may occur:

"Image from origin 'http://www.ifremer.fr' has been blocked
from loading by Cross-Origin Resource Sharing policy: 
No 'Access-Control-Allow-Origin' header is present on 
the requested resource. Origin 'http://localhost:8080' 
is therefore not allowed access"

I don't have the capability to set CORS header on the WMS used (like suggested here https://github.com/openlayers/ol3-cesium/issues/127).

It looks like a proxy can be set up at Cesium level (see https://cesiumjs.org/2013/01/04/Cesium-Imagery-Layers-Tutorial/).

Can it be setup at OL level so that it set it up at Cesium level ? and if yes, how ?

Upvotes: 0

Views: 4684

Answers (6)

3WA羽山秋人
3WA羽山秋人

Reputation: 150

Spend a lot of time trying and getting the experience.............~_~

WMTS olcs.proxy example :

var o_tileGrid = {
  origin: ol.extent.getTopLeft(projectionExtent),
  resolutions: resolutions,
  matrixIds: matrixIds
};
var o = {
  attributions: '',
  url: url,
  layer: layer,
  matrixSet: matrixSet,
  format: format,
  projection: projection,
  tileGrid: new ol.tilegrid.WMTS(o_tileGrid),
  style: style,
  wrapX: true
};                
var source = new ol.source.WMTS(o);
var proxy = "http://proxy.example.../";      
source.set("olcs.proxy",proxy);

Upvotes: 0

Francois Prunayre
Francois Prunayre

Reputation: 11

With https://github.com/openlayers/ol3-cesium/pull/358, user can now set the olcs.proxy property on the source of the layer. eg:

source.set('olcs.proxy', '/myproxy/url');

Upvotes: 1

Michael Saunby
Michael Saunby

Reputation: 81

I'm not using Cesium, just ThreeJS, but get the same CORS problem without a little image copying trick. This works for me -

function loadWmsImage( url, params, cb ){
  var tmpImage = new Image();
  var wmsPng = url + jQuery.param( params );
  tmpImage.onload = function(){
    var canv = document.createElement('canvas');
    var ctx = canv.getContext('2d');
    canv.width = this.width;
    canv.height = this.height;
    ctx.drawImage(this, 0, 0);
    cb(canv.toDataURL());
  }
  tmpImage.crossOrigin = 'anonymous';
  tmpImage.src =  wmsPng;
}

loadWmsImage( htMapUrl, htMapParams,
  function(img){
    customUniforms.bumpTexture.value = 
      new THREE.ImageUtils.loadTexture(img);
  });

Upvotes: 0

Thomas Gratier
Thomas Gratier

Reputation: 2371

A quick code search in ol3 code base shows that you can't set proxy at OL level.

Just use the WMS URL through a public CORS proxy (in first). I already answered a similar question It can maybe help.

Upvotes: 0

kring
kring

Reputation: 286

You can use a proxy just by modifying the URL, rather than by teaching OL3 about proxies. For example, if your WMS server is:

http://www.example.com/geoserver/ows

You can just pass this URL to OL3 to make it go through your proxy at /proxy:

/proxy/http://www.example.com/geoserver/ows

Upvotes: 2

Mike LP
Mike LP

Reputation: 709

Looking at the initialization code for OL3-Cesium, there is no built in functionality for applying the proxy at the OL level.

You could try to copy over the imageryProvider settings for the layers they created and include the proxy on the new one.

I haven't tried this so I don't know if that will work, but it's worth a shot if OL3 doesn't plan to release an update any time soon that fixes this.

Upvotes: 0

Related Questions