diff --git a/web/client/components/misc/SecureImage.jsx b/web/client/components/misc/SecureImage.jsx
index 649031d18c..10c1bed0fe 100644
--- a/web/client/components/misc/SecureImage.jsx
+++ b/web/client/components/misc/SecureImage.jsx
@@ -9,7 +9,8 @@
 import React, { useEffect, useState } from 'react';
 import axios from 'axios';
 
-import { getAuthenticationMethod } from '../../utils/SecurityUtils';
+import { getAuthKeyParameter, getAuthenticationMethod, getToken } from '../../utils/SecurityUtils';
+import { updateUrlParams } from '../../utils/URLUtils';
 
 
 const SecureImage = ({
@@ -42,6 +43,16 @@ const SecureImage = ({
                 .catch((error) => {
                     console.error('Error fetching image:', error);
                 });
+        } else if (authMethod === "authkey") {
+            const authParam = getAuthKeyParameter(src);
+            const token = getToken();
+            if (authParam && token) {
+                const newSrc = updateUrlParams(src, {[authParam]: token});
+                setImageSrc(newSrc);
+            } else {
+                setImageSrc(src);
+            }
+
         } else {
             setImageSrc(src);
         }
diff --git a/web/client/utils/URLUtils.js b/web/client/utils/URLUtils.js
index 29c3909186..af5fd53998 100644
--- a/web/client/utils/URLUtils.js
+++ b/web/client/utils/URLUtils.js
@@ -129,3 +129,17 @@ export const isValidURLTemplate = (url, params, regexp = /^(http(s{0,1}):\/\/)+?
 export const getDefaultUrl = (url) => {
     return isArray(url) ? url[0] : url;
 };
+
+/**
+ * Updates the given URL by adding or updating query parameters.
+ *
+ * @param {string} url - The source URL.
+ * @param {Object} params - The parameters to add or update.
+ * @returns {string} - The updated URL with new query parameters.
+ */
+export function updateUrlParams(url, params) {
+    const parsedUrl = queryString.parseUrl(url);
+    const updatedQuery = { ...parsedUrl?.query, ...params };
+    // TODO: use stringifyUrl instead after updating `query-string`, not supported in current version
+    return parsedUrl?.url + '?' + queryString.stringify(updatedQuery);
+}
diff --git a/web/client/utils/__tests__/URLUtils-test.js b/web/client/utils/__tests__/URLUtils-test.js
index b6a16e64cc..6b876cfda8 100644
--- a/web/client/utils/__tests__/URLUtils-test.js
+++ b/web/client/utils/__tests__/URLUtils-test.js
@@ -7,7 +7,7 @@
  */
 import expect from 'expect';
 
-import { urlParts, isSameUrl, sameQueryParams, isValidURL, isValidURLTemplate, getDefaultUrl } from '../URLUtils';
+import { urlParts, isSameUrl, sameQueryParams, isValidURL, isValidURLTemplate, getDefaultUrl, updateUrlParams } from '../URLUtils';
 
 const url1 = "https://demo.geo-solutions.it:443/geoserver/wfs";
 const url2 = "https://demo.geo-solutions.it/geoserver/wfs";
@@ -179,6 +179,17 @@ describe('URLUtils', () => {
 
         expect(getDefaultUrl(_url)).toBe(_url[0]);
     });
+
+    it("update Url params", () => {
+        const url = 'https://my-site.com/some/path/to/resouce?query=true&passtest=true';
+        const updatedUrl = updateUrlParams(url, { query: false, passtest: false });
+        expect(updatedUrl).toBe('https://my-site.com/some/path/to/resouce?passtest=false&query=false');
+    });
+    it("add new Url param", () => {
+        const url = 'https://my-site.com/some/path/to/resouce';
+        const updatedUrl = updateUrlParams(url, { newParam: 'newValue' });
+        expect(updatedUrl).toBe('https://my-site.com/some/path/to/resouce?newParam=newValue');
+    });
 });