Support relative URLs (#1400)

* Fix doc typo

* Link to issue #1309 (API version separation)

* Support relative links for legend URL:s

See #1399

* Let printing plug-in support relative URL:s

* Part of #1399

new-backend/server/common/server.js

@@ -292,7 +292,7 @@ built-it compression by setting the ENABLE_GZIP_COMPRESSION option to "true" in
    * - /api/v1/proxy/geoserver
    * - /api/v2/proxy/geoserver
    * @issue https://github.com/hajkmap/Hajk/issues/824
-   * @issue https://github.com/hajkmap/Hajk/issues/1390
+   * @issue https://github.com/hajkmap/Hajk/issues/1309
    * @returns
    * @memberof ExpressServer
    */

new-client/src/plugins/Print/Print.js

@@ -110,6 +110,7 @@ class Print extends React.PureComponent {
       map: props.map,
       options: props.options,
       dims: this.dims,
+      proxy: props.app.config.proxy,
       mapConfig: props.app.config.mapConfig.map,
     });
   }

new-client/src/plugins/Print/PrintModel.js

@@ -21,6 +21,7 @@ import ImageWMS from "ol/source/ImageWMS";
 import { ROBOTO_NORMAL } from "./constants";
 export default class PrintModel {
   constructor(settings) {
+    this.proxy = settings.proxy;
     this.map = settings.map;
     this.dims = settings.dims;
     this.logoUrl = settings.options.logo || "";
@@ -84,6 +85,8 @@ export default class PrintModel {
     300000: 20000,
   };
 
+  fakeBase = "https://hajk.js.internal";
+
   previewLayer = null;
   previewFeature = null;
 
@@ -931,6 +934,21 @@ export default class PrintModel {
     }
   };
 
+  // Returns an URL object from the src string, prepended with proxy if any.
+  // Uses a fake base for resolving relative URL:s so we can detect this when
+  // resolving the final URL to string (and remove it).
+  // This let's us work with NodeJS URL API with relative URL:s.
+  getURL = (src) => {
+    const location = (this.proxy || "") + src;
+    return new URL(location, this.fakeBase);
+  };
+
+  // Returns a string with the complete URL, removing fake base if any.
+  toURLString = (url) => {
+    const urlString = url.toString();
+    return urlString.replace(this.fakeBase, "");
+  };
+
   // Returns an array of objects containing information regarding the tiles
   // that should be created to comply with the supplied 'MAX_TILE_SIZE' and
   // also 'fill' the image.
@@ -981,7 +999,7 @@ export default class PrintModel {
       // into consideration).
       source.setImageLoadFunction((image, src) => {
         // Let's create an URL-object so that we can easily grab and alter search-parameters.
-        const url = new URL(src);
+        const url = this.getURL(src);
         const searchParams = url.searchParams;
         // We have to make sure to update the search-parameters to include dpi-settings.
         searchParams.set("DPI", options.resolution);
@@ -1010,13 +1028,16 @@ export default class PrintModel {
           // Then, for each tile-information-object, we'll create a request-url containing the
           // information that we've gathered (such as the size and bounding-box).
           for (const tile of tiles) {
-            const tileUrl = new URL(url.toString());
+            const tileUrl = this.getURL(url.toString());
             tileUrl.searchParams.set("BBOX", tile.bBox);
             tileUrl.searchParams.set("HEIGHT", tile.tileHeight);
             tileUrl.searchParams.set("WIDTH", tile.tileWidth);
             // Then we'll fetch the images from the WMS-server
             promises.push(
-              this.loadImageTile(canvas, { ...tile, url: tileUrl.toString() })
+              this.loadImageTile(canvas, {
+                ...tile,
+                url: this.toURLString(tileUrl),
+              })
             );
           }
           // When all image-promises has settled, we can set the image to the canvas on which we've
@@ -1026,7 +1047,7 @@ export default class PrintModel {
           });
         } else {
           // If the request is not too complex, we can fetch it right away.
-          image.getImage().src = url.toString();
+          image.getImage().src = this.toURLString(url);
         }
       });
     } catch (error) {

new-client/src/utils/ConfigMapper.js

@@ -62,9 +62,7 @@ export default class ConfigMapper {
         legendUrl = args.legend;
       }
 
-      // If 'legend' URL doesn't start with "http", add "https://" prior 'legend', else let it be as is
-      const protocol = /^http/.test(legendUrl) ? "" : "https://";
-      return protocol + legendUrl;
+      return legendUrl;
     }
 
     function getLegends() {