feature: post method for wms and wfs

src/layer/wfs.js

@@ -33,6 +33,7 @@ export default function wfs(layerOptions, viewer) {
     wfsOptions.visible = true;
   }
   sourceOptions.strategy = layerOptions.strategy ? layerOptions.strategy : sourceOptions.strategy;
+  sourceOptions.requestMethod = layerOptions.requestMethod ? layerOptions.requestMethod : sourceOptions.requestMethod;
   switch (sourceOptions.strategy) {
     case 'all':
       sourceOptions.loadingstrategy = LoadingStrategy.all;

src/layer/wfssource.js

@@ -63,6 +63,14 @@ class WfsSource extends VectorSource {
       .catch(() => failure());
   }
 
+  /**
+   * Set request method for layer
+   * @param {any} method
+   */
+  setMethod(method) {
+    this._options.requestMethod = method;
+  }
+
   /**
    * Set filter on layer
    * @param {any} cql
@@ -128,9 +136,24 @@ class WfsSource extends VectorSource {
     url = encodeURI(url);
 
     // Actually fetch some features
-    const JsonFeatures = await fetch(url).then(response => response.json({
-      cache: false
-    }));
+    let JsonFeatures;
+    if (this._options.requestMethod && this._options.requestMethod.toLowerCase() === 'post') { // POST request
+      const split = url.split('?');
+      JsonFeatures = await fetch(split[0], {
+        method: 'POST',
+        headers: {
+          'Content-Type': 'application/x-www-form-urlencoded;charset=UTF-8'
+        },
+        body: split[1]
+      }).then(response => response.json({
+        cache: false
+      }));
+    } else { // GET request
+      JsonFeatures = await fetch(url).then(response => response.json({
+        cache: false
+      }));
+    }
+
     const features = super.getFormat().readFeatures(JsonFeatures);
     // Delete the geometry if it is a table (ignoring geometry) as the GeoJSON loader creates an empty geometry and that will
     // mess up saving the feature

src/layer/wms.js

@@ -20,6 +20,9 @@ function createTileSource(options) {
       STYLES: options.style
     }
   };
+  if (options.imageLoadFunction) {
+    sourceOptions.tileLoadFunction = options.imageLoadFunction;
+  }
   if (options.params) {
     Object.keys(options.params).forEach((element) => {
       sourceOptions.params[element] = options.params[element];
@@ -41,6 +44,9 @@ function createImageSource(options) {
       STYLES: options.style
     }
   };
+  if (options.imageLoadFunction) {
+    sourceOptions.imageLoadFunction = options.imageLoadFunction;
+  }
   if (options.params) {
     Object.keys(options.params).forEach((element) => {
       sourceOptions.params[element] = options.params[element];
@@ -98,6 +104,29 @@ function createWmsStyle({ wmsOptions, source, viewer, initialStyle = false }) {
   return styleName;
 }
 
+function imageLoadFunction(loadedImage, src) {
+  const xhr = new XMLHttpRequest();
+  xhr.responseType = 'blob';
+  xhr.addEventListener('loadend', function loaded() {
+    const data = this.response;
+    if (data) {
+      const img = loadedImage.getImage();
+      const url = URL.createObjectURL(data);
+      img.addEventListener('loadend', () => {
+        URL.revokeObjectURL(url);
+      });
+      img.src = url;
+    }
+  });
+  const split = src.split('?');
+  xhr.open('POST', split[0]);
+  xhr.setRequestHeader(
+    'Content-type',
+    'application/x-www-form-urlencoded'
+  );
+  xhr.send(split[1]);
+}
+
 function createWmsLayer(wmsOptions, source, viewer) {
   const wmsOpts = wmsOptions;
   const wmsSource = source;
@@ -153,6 +182,7 @@ const wms = function wms(layerOptions, viewer) {
   sourceOptions.filterType = wmsOptions.filterType;
   sourceOptions.params = wmsOptions.sourceParams;
   sourceOptions.format = wmsOptions.format ? wmsOptions.format : sourceOptions.format;
+  sourceOptions.requestMethod = wmsOptions.requestMethod ? wmsOptions.requestMethod : sourceOptions.requestMethod;
   if (!wmsOptions.stylePicker) {
     const styleSettings = viewer.getStyle(wmsOptions.styleName);
     const wmsStyleObject = styleSettings ? styleSettings[0].find(s => s.wmsStyle) : undefined;
@@ -172,6 +202,10 @@ const wms = function wms(layerOptions, viewer) {
     }
   }
 
+  if (sourceOptions.requestMethod && sourceOptions.requestMethod === 'post') {
+    sourceOptions.imageLoadFunction = imageLoadFunction;
+  }
+
   if (renderMode === 'image') {
     const source = createImageSource(sourceOptions);
     createWmsLayer(wmsOptions, source, viewer);