GeoServer-权限认证-OpenLayers加载

GeoServer开启HTTP Header过滤器后，在访问时需要在header中添加键值对：

{'xianshengsu': 'xianshengsu'}

key值必须与proxy中设置的“Request header attribute”相同；value值随意但不得为空，否则header会被忽略，开发中可以在network中检查header是否正常。

 利用 tileLoadFunction 参数在请求时添加header，以WMS服务为例：

        let railways = new ol.layer.Tile({
            source: new ol.source.TileWMS({
                url: 'http://ip:port/geoserver/ows',
                params: {
                    layers: "layerName",
                    width: 256,
                    height: 256,
                    crs: "epsg:3857",
                    format: "image/png"
                },
                serverType: 'geoserver',
				tileLoadFunction: function(tile, src) {
					  const xhr = new XMLHttpRequest();
					  xhr.responseType = 'blob';
					  xhr.addEventListener('loadend', function (evt) {
						const data = this.response;
						if (data !== undefined) {
						  tile.getImage().src = URL.createObjectURL(data);
						} else {
						  tile.setState(TileState.ERROR);
						}
					  });
					  xhr.addEventListener('error', function () {
						tile.setState(TileState.ERROR);
					  });
					  xhr.open('GET', src);
					  xhr.setRequestHeader('xianshengsu','xianshengsu');
					  xhr.send();
				}
            })
        });