0

使用 ol-cesium 构建应用程序,取决于 WMS,可能会出现跨域错误:

"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"

我没有能力在使用的 WMS 上设置 CORS 标头(如此处建议的https://github.com/openlayers/ol3-cesium/issues/127)。

看起来可以在 Cesium 级别设置代理(请参阅https://cesiumjs.org/2013/01/04/Cesium-Imagery-Layers-Tutorial/)。

可以在 OL 级别设置,以便在 Cesium 级别进行设置吗?如果是,如何?

4

6 回答 6

2

您可以通过修改 URL 来使用代理,而不是通过向 OL3 教授代理。例如,如果您的 WMS 服务器是:

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

您可以将此 URL 传递给 OL3 以使其通过您的代理/proxy

/proxy/http://www.example.com/geoserver/ows
于 2015-06-10T12:34:47.357 回答
1

使用https://github.com/openlayers/ol3-cesium/pull/358,用户现在可以在层的源上设置 olcs.proxy 属性。例如:

source.set('olcs.proxy', '/myproxy/url');
于 2016-06-09T11:32:32.827 回答
0

查看 OL3-Cesium 的初始化代码,没有在 OL 级别应用代理的内置功能。

您可以尝试复制他们创建的图层的 imageryProvider 设置,并在新图层上包含代理。

我还没有尝试过,所以我不知道这是否可行,但如果 OL3 不打算很快发布修复此问题的更新,那么值得一试。

于 2015-06-10T04:35:56.303 回答
0

ol3 代码库中的快速代码搜索显示您无法在 OL 级别设置代理。

只需通过公共 CORS 代理(首先)使用 WMS URL。我已经回答了一个类似的问题 它可能会有所帮助。

于 2015-06-10T21:01:48.753 回答
0

花很多时间尝试和获得经验......〜_〜

WMTS olcs.proxy 示例:

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);  


于 2019-07-18T03:13:19.920 回答
0

我没有使用 Cesium,只使用了 ThreeJS,但是没有一点图像复制技巧就得到了相同的 CORS 问题。这对我有用 -

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);
  });
于 2015-07-25T11:01:11.447 回答