Question

这确实是我在openlayers上见过的坚强行为。

我创建了一个jsfiddle来演示此问题。

奇怪的行为是：当我将参数crossOrigin添加到我的图层后，该图层便消失了，您可以在jsfiddle中尝试一下（您需要启用{ {1}}参数）。或在下面查看：

crossOrigin

我需要使用var map = new ol.Map({ target: 'map', layers: [ ], view: new ol.View({ projection: 'EPSG:4326', maxZoom: 25, center: [8.86, 54.13], zoom: 10, }) }); var wmsSource = new ol.source.TileWMS({ preload: Infinity, url: 'http://service.gdi-sh.de/WMS_SH_BDDcol_KF?', params: { 'LAYERS': 'DTK5col,DTK25col,DTK50col,DTK100col,UEK250,UEK600,UEK1500', 'TILED': true, 'STYLES': new String(''), 'FORMAT': 'image/jpeg', 'SRS': 'EPSG:4326', 'VERSION': '1.1.1' }, serverType: 'geoserver', //crossOrigin: 'anonymous' //<-- as soon as I enable this line, the layer dissappers }); var wmsLayer = new ol.layer.Tile({ source: wmsSource }) map.addLayer(wmsLayer);参数来避免crossOrigin出现另一个问题：

https://gis.stackexchange.com/questions/269937/openlayers-4-method-foreachlayeratpixel-throws-securityerror-the-operation-is

解决方案是将forEachLayerAtPixel()参数添加到我的所有图层中，并且该参数对于我拥有的所有其他图层都适用，但仅对于该图层，它会使该图层消失

更有趣：如果我在firefox上打开调试程序，并看到对服务器的请求。状态为200，所有img已成功加载（您甚至可以在网络分析中看到img）

所以我想知道，如果可以加载该层并且有图片，是什么使该层消失了？一旦我用crossOrigin取消了该行，所有的一切正常。

Answer 1

在未启用WORS服务器的情况下，或者尝试从https应用程序访问http服务器网址时，就会发生这种情况。您仍然可以在不使用crossOrigin参数的情况下加载它，但是图像将被污染。首先尝试将WMS网址从http更改为https，但是如果这样做不起作用，则需要使用相同的原始（或启用了CORS的）代理。为了确保正确传递WMS参数，您将需要在加载时对图瓦网址进行URI编码，例如：

var wmsSource = new ol.source.TileWMS({
    preload: Infinity,
  url: 'http://service.gdi-sh.de/WMS_SH_BDDcol_KF?',
  params: {
    'LAYERS': 'DTK5col,DTK25col,DTK50col,DTK100col,UEK250,UEK600,UEK1500',
    'TILED': true,
    'STYLES': new String(''),
    'FORMAT': 'image/jpeg',
    'SRS': 'EPSG:4326',
    'VERSION': '1.1.1'
  },
  serverType: 'geoserver',
  crossOrigin: 'anonymous',
  tileLoadFunction: function(imageTile, src) {
    imageTile.getImage().src = 'myproxy.php?url=' + encodeURIComponent(src);
  }
});

我现在已经检查了您正在使用的WMS服务-http或https中均未启用CORS，因此您肯定需要使用代理。

Answer 2

发生此问题是因为未启用服务器（在您的情况下为码头）。因此，您应该更改服务器的配置。请执行以下两个步骤：

下载this file并将其放在Geoserver的安装文件夹下的webapps\geoserver\WEB-INF\lib目录中（您应该使用与码头兼容的文件，因此您可能会找到另一个合适的库{{3} }）。
转到webapps\geoserver\WEB-INF并打开web.xml文件。取消注释这两个标签。

此：

  <filter>
      <filter-name>cross-origin</filter-name>
      <filter-class>org.eclipse.jetty.servlets.CrossOriginFilter</filter-class>
  </filter>

还有这个

  <filter-mapping>
      <filter-name>cross-origin</filter-name>
      <url-pattern>/*</url-pattern>
  </filter-mapping>

现在停止并再次启动Geoserver以验证问题是否已解决。

openlayers crossOrigin参数使图层消失

2 个答案: