Added own version of wms header lib

layered-map-widget-plugin/service/wms-layer.service.ts

@@ -7,7 +7,7 @@ import {
 } from '../../layered-map-widget-plugin/layered-map-widget.model';
 
 import { Injectable } from '@angular/core';
-import 'leaflet-wms-header';
+import 'cumulocity-leaflet-wms-header';
 import { TileLayer, tileLayer } from 'leaflet';
 import { FetchClient } from '@c8y/client';
 
@@ -24,54 +24,28 @@ export class WMSLayerService {
  return [];
  }
 
- // async createWMSLayer(layerConfig: LayerConfig<WebMapServiceLayerConfig>) {
- // const cfg = layerConfig.config as WebMapServiceLayerConfig;
- // const layers = cfg.wmsLayers.map((l) => l.name).toString();
- // const shortUrl = cfg.url.split('?')[0];
- // if (cfg.token) {
- // const headers = await this.getLoginHeaders(cfg.token);
- // const layer = TileLayer.wmsHeader(
- // shortUrl,
- // {
- // layers,
- // format: 'image/png',
- // transparent: true,
- // crossOrigin: 'anonymous',
- // referrerPolicy: 'unsafe-url',
- // },
- // headers,
- // null,
- // null
- // );
- // return layer;
- // } else {
- // const layer = tileLayer.wms(shortUrl, {
- // layers,
- // format: 'image/png',
- // transparent: true,
- // });
- // return layer;
- // }
- // }
-
  createWMSLayer(layerConfig: LayerConfig<WebMapServiceLayerConfig>) {
  const cfg = layerConfig.config as WebMapServiceLayerConfig;
  const layers = cfg.wmsLayers.map((l) => l.name).toString();
  const shortUrl = cfg.url.includes('?') ? cfg.url.split('?')[0] : cfg.url;
 
  if (cfg.token) {
- const url = `${this.fetch.baseUrl}service/c2c-integration/api/geoserver-proxy`;
- const layer = TileLayer.wmsHeader(
+ const url = `service/c2c-integration/api/geoserver-proxy`;
+ const layer = TileLayer.c8yWMSHeader(
  url,
  {
  layers,
  format: shortUrl,
  transparent: true,
  version: cfg.token,
  },
- [this.getXSRFHeader()].filter(Boolean),
- null,
- null
+ {
+ method: 'GET',
+ headers: {
+ 'Content-Type': 'image/png',
+ },
+ },
+ this.fetch
  );
  return layer;
  } else {
@@ -83,25 +57,4 @@ export class WMSLayerService {
  return layer;
  }
  }
-
- private getXSRFHeader() {
- let token = '';
- try {
- const name = 'XSRF-TOKEN';
- const value = document.cookie.match('(^|;)\\s*' + name + '\\s*=\\s*([^;]+)');
- token = value ? value.pop() : undefined;
- } catch (ex) {
- return undefined;
- }
- return token ? { header: 'X-XSRF-TOKEN', value: token } : undefined;
- }
-
- // async getLoginHeaders(token: string) {
- // const credentials = await this.tenantOptionCredentials.getCredentials(token);
- // const { username, password } = credentials;
- // return [
- // { header: 'Authorization', value: 'Basic ' + btoa(username + ':' + password) },
- // { header: 'content-type', value: 'text/plain' },
- // ];
- // }
 }

package.json

@@ -1,6 +1,6 @@
 {
  "name": "layered-map-widget-plugin",
- "version": "3.1.0",
+ "version": "3.1.1",
  "description": "Show markers on a layer basis. Create layers based on filter criteria.",
  "scripts": {
  "start": "c8ycli server",
@@ -21,6 +21,10 @@
  "layered",
  "WMS"
  ],
+ "private": true,
+ "workspaces": [
+ "lib/cumulocity-leaflet-wms-header"
+ ],
  "author": "Hendrik Naether",
  "license": "Apache-2.0",
  "dependencies": {
@@ -35,13 +39,13 @@
  "@angular/router": "14.0.6",
  "@angular/upgrade": "14.0.6",
  "@asymmetrik/ngx-leaflet": "^14.0.1",
+ "cumulocity-leaflet-wms-header": "0.0.1",
  "@c8y/client": "1018.0.233",
  "@c8y/ngx-components": "1018.0.233",
  "@c8y/style": "1018.0.233",
  "@ngx-translate/core": "14.0.0",
  "jsoneditor": "^9.10.2",
  "leaflet": "^1.9.4",
- "leaflet-wms-header": "^1.0.13",
  "moment": "^2.29.4",
  "ngx-bootstrap": "9.0.0",
  "rxjs": "~6.6.3",