From 207b40a4c20196c667fc57e87581510677a76cca Mon Sep 17 00:00:00 2001 From: Benstone Zhang Date: Sat, 25 Nov 2023 10:27:02 +0800 Subject: [PATCH] add basic auth support for map server Signed-off-by: Benstone Zhang --- css/adminSettings.css | 3 ++- lib/Controller/PageController.php | 3 ++- lib/Controller/PublicUtilsController.php | 1 + lib/Controller/UtilsController.php | 2 ++ lib/Settings/AdminSettings.php | 1 + src/adminSettings.js | 10 ++++++---- src/components/Map.vue | 24 ++++++++++++++++++++++-- templates/adminSettings.php | 6 ++++-- 8 files changed, 40 insertions(+), 10 deletions(-) diff --git a/css/adminSettings.css b/css/adminSettings.css index fa69871e70..e31b1279ec 100644 --- a/css/adminSettings.css +++ b/css/adminSettings.css @@ -4,7 +4,8 @@ #graphhopperURL, #graphhopperAPIKEY, #mapboxAPIKEY, -#maplibreStreetStyleURL +#maplibreStreetStyleURL, +#maplibreStreetStyleAuth { width: 400px; } diff --git a/lib/Controller/PageController.php b/lib/Controller/PageController.php index bd65c91f0d..3e3aa390cf 100644 --- a/lib/Controller/PageController.php +++ b/lib/Controller/PageController.php @@ -122,7 +122,8 @@ private function addCsp($response): void { 'osrmCarURL', 'osrmFootURL', 'graphhopperURL', - 'maplibreStreetStyleURL' + 'maplibreStreetStyleURL', + 'maplibreStreetStyleAuth' ]; foreach ($urlKeys as $key) { $url = $this->config->getAppValue('maps', $key); diff --git a/lib/Controller/PublicUtilsController.php b/lib/Controller/PublicUtilsController.php index 2c5bc78e37..be5319e588 100644 --- a/lib/Controller/PublicUtilsController.php +++ b/lib/Controller/PublicUtilsController.php @@ -210,6 +210,7 @@ public function getOptionsValues(): DataResponse { 'graphhopperAPIKEY', 'mapboxAPIKEY', 'maplibreStreetStyleURL', + 'maplibreStreetStyleAuth', 'graphhopperURL' ]; foreach ($settingsKeys as $k) { diff --git a/lib/Controller/UtilsController.php b/lib/Controller/UtilsController.php index 4a7260a57c..c7285acb84 100644 --- a/lib/Controller/UtilsController.php +++ b/lib/Controller/UtilsController.php @@ -151,6 +151,7 @@ public function getOptionsValues($myMapId=null): DataResponse { 'graphhopperAPIKEY', 'mapboxAPIKEY', 'maplibreStreetStyleURL', + 'maplibreStreetStyleAuth', 'graphhopperURL' ]; foreach ($settingsKeys as $k) { @@ -175,6 +176,7 @@ public function setRoutingSettings($values): DataResponse { 'graphhopperAPIKEY', 'mapboxAPIKEY', 'maplibreStreetStyleURL', + 'maplibreStreetStyleAuth', 'graphhopperURL' ]; foreach ($values as $k=>$v) { diff --git a/lib/Settings/AdminSettings.php b/lib/Settings/AdminSettings.php index d7302cc0eb..f4410c82bf 100644 --- a/lib/Settings/AdminSettings.php +++ b/lib/Settings/AdminSettings.php @@ -47,6 +47,7 @@ public function getForm() { 'graphhopperAPIKEY', 'mapboxAPIKEY', 'maplibreStreetStyleURL', + 'maplibreStreetStyleAuth', 'graphhopperURL' ]; $parameters = []; diff --git a/src/adminSettings.js b/src/adminSettings.js index 53101c7619..88d2fffd7f 100644 --- a/src/adminSettings.js +++ b/src/adminSettings.js @@ -39,10 +39,12 @@ $(document).ready(function() { 'input#graphhopperAPIKEY, ' + '#osrmDEMO, ' + 'input#mapboxAPIKEY, ' + - 'input#maplibreStreetStyleURL', function(e) { - var value = $(this).val(); - setMapsRoutingSettings($(this).attr('id'), value); - }); + 'input#maplibreStreetStyleURL, ' + + 'input#maplibreStreetStyleAuth', + function(e) { + var value = $(this).val(); + setMapsRoutingSettings($(this).attr('id'), value); + }); $('body').on('change', '#osrmDEMO', function(e) { var value = $(this).is(':checked') ? '1' : '0'; setMapsRoutingSettings($(this).attr('id'), value); diff --git a/src/components/Map.vue b/src/components/Map.vue index 9df681ec02..12a29d5f3f 100644 --- a/src/components/Map.vue +++ b/src/components/Map.vue @@ -175,6 +175,7 @@ import 'mapbox-gl/dist/mapbox-gl' import 'mapbox-gl/dist/mapbox-gl.css' import 'mapbox-gl-leaflet/leaflet-mapbox-gl' import '@maplibre/maplibre-gl-leaflet' +import ResourceType from 'maplibre-gl' import { baseLayersByName, overlayLayersByName, @@ -784,18 +785,37 @@ export default { if ((gl !== null) && ('maplibreStreetStyleURL' in this.optionValues && this.optionValues.maplibreStreetStyleURL !== '')) { + let token = null + if ('maplibreStreetStyleAuth' in this.optionValues && this.optionValues.maplibreStreetStyleAuth !== '') { + token = this.optionValues.maplibreStreetStyleAuth + } + // wrapper to make tile layer component correctly pass arguments L.myMaplibreGL = (url, options) => { + if (token !== null) { + token = 'Basic ' + btoa(token) + const oldTransform = options.transformRequest + options.transformRequest = (url, resourceType) => { + const param = oldTransform?.() || {} + param.url = param.url || url + if (resourceType === ResourceType.Tile) { + param.type = 'arrayBuffer' + } + param.headers = param.headers || {} + param.headers.Authorization = token + return param + } + } return new L.maplibreGL(options) } this.allBaseLayers = {} Object.keys(baseLayersByName).forEach(id => { if (id === 'Open Street Map') { - let layer = Object.assign({}, baseLayersByName[id]); + const layer = Object.assign({}, baseLayersByName[id]) delete layer.url layer.tileLayerClass = L.myMaplibreGL - layer.options = Object.assign({}, layer.options); + layer.options = Object.assign({}, layer.options) layer.options.style = this.optionValues.maplibreStreetStyleURL layer.options.minZoom = 0 layer.options.maxZoom = 22 diff --git a/templates/adminSettings.php b/templates/adminSettings.php index 196fab3aed..0f1d8a2fa5 100644 --- a/templates/adminSettings.php +++ b/templates/adminSettings.php @@ -48,10 +48,12 @@

t('MapLibre settings')); ?>

-

t('Set the URL of style.json for OpenStreetMap Vector Tiles with MapLibre-GL-JS')); ?>

+

t('Set the URL and Basic Authorization of style.json for OpenStreetMap Vector Tiles with MapLibre-GL-JS.')); ?>

t('Leave empty to disable.')); ?>



- +
+
+