Skip to content

Added custom fetchOptions management for overlays, added a proxyUrl parameter #1336

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
wants to merge 5 commits into
base: master
Choose a base branch
from
Open

Added custom fetchOptions management for overlays, added a proxyUrl parameter #1336

Show file tree
Hide file tree
Changes from 3 commits
Commits
Show all changes
5 commits
Select commit Hold shift + click to select a range
5ccd24a
Initial managemente for custom authentication for Image Overlays, add…
SoftwareMechanic Oct 7, 2025
c5d7d80
Merge branch 'NASA-AMMOS:master' into master
SoftwareMechanic Oct 7, 2025
ea57b15
Update ImageOverlay for a better proxy url management (in order to av…
SoftwareMechanic Oct 21, 2025
18602ee
Update ImageOverlayPlugin
SoftwareMechanic Oct 30, 2025
371bb6d
Update ImageOverlayPlugin - fixed lint errors
SoftwareMechanic Oct 30, 2025
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
3 changes: 2 additions & 1 deletion src/three/plugins/images/ImageOverlayPlugin.d.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -21,6 +21,8 @@ export class ImageOverlay {
color: number | Color;
opacity: number;
frame?: Matrix4 | null;
proxyUrl?: string;
fetchOptions?: any;

}

Expand Down Expand Up @@ -72,7 +74,6 @@ export class WMSTilesOverlay extends ImageOverlay {
levels?: number,
transparent?: boolean,
contentBoundingBox?: [ number, number, number, number ],

color: number | Color,
opacity: number,
frame?: Matrix4 | null,
Expand Down
19 changes: 16 additions & 3 deletions src/three/plugins/images/ImageOverlayPlugin.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -961,7 +961,8 @@ export class ImageOverlayPlugin {
_initOverlay( overlay ) {

const { tiles } = this;
overlay.imageSource.fetchOptions = tiles.fetchOptions;
overlay.imageSource.fetchOptions = overlay.fetchOptions;

if ( ! overlay.isInitialized ) {

overlay.imageSource.fetchData = ( ...args ) => tiles
Expand Down Expand Up @@ -1407,8 +1408,12 @@ class ImageOverlay {
opacity = 1,
color = 0xffffff,
frame = null,
fetchOptions = {},
preprocessURL = null,
} = options;
this.imageSource = null;
this.fetchOptions = fetchOptions;
Copy link
Contributor

@gkjohnson gkjohnson Oct 24, 2025

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Since the options on imageSource are really the ones being used here it may make most sense to add getters / setters for those options instead of storing them multiple places:

get fetchOptions() { return this.imageSource.fetchOptions; }
set fetchOptions( v ) { this.imageSource.fetchOptions = v; }

Copy link
Contributor Author

@SoftwareMechanic SoftwareMechanic Oct 30, 2025 •
edited
Loading

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Agree, but in order to make fetchOptions still usable as a parameter in the constructor from the client (and so for usage in R3F) I had to set the imageSource fetchOptions in the WMSTilesOverlay using the options, otherwise I can't set from ImageOverlay the fetch Options before the imageSource is defined.

export class WMSTilesOverlay extends ImageOverlay {

	constructor( options = {} ) {

		super( options );
		
		this.imageSource = new WMSImageSource( options );

		if (options.fetchOptions) {

			this.imageSource.fetchOptions = options.fetchOptions;

		}

		this.imageSource.fetchData = ( ...args ) => this.fetch( ...args );

	}
... rest of the code

if this the way to go I would consider implementing the same logic for all other overlays

this.preprocessURL = preprocessURL;
this.opacity = opacity;
this.color = new Color( color );
this.frame = frame !== null ? frame.clone() : null;
Expand All @@ -1428,9 +1433,17 @@ class ImageOverlay {

}

fetch( ...args ) {
// Apply proxy prefix and merge options
fetch( url, options = {} ) {

if ( this.preprocessURL ) {

url = this.preprocessURL( url );

}

return fetch( ...args );
const finalOptions = { ...this.fetchOptions, ...options };
return fetch( url, finalOptions );

}

Expand Down
9 changes: 8 additions & 1 deletion src/three/plugins/images/sources/WMSImageSource.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -140,7 +140,6 @@ export class WMSImageSource extends TiledImageSource {
REQUEST: 'GetMap',
VERSION: version,
LAYERS: layer,
STYLES: styles,
[ crsParam ]: crs,
BBOX: bboxParam.join( ',' ),
WIDTH: tileDimension,
Expand All @@ -149,6 +148,14 @@ export class WMSImageSource extends TiledImageSource {
TRANSPARENT: transparent ? 'TRUE' : 'FALSE',
} );

// Only add STYLES if it's defined (not null or undefined)
// This is a WMS-specific parameter, and giving it an unexpected value can lead to errors
if ( styles !== null && styles !== undefined ) {

params.set( 'STYLES', styles );

}

return new URL( '?' + params.toString(), this.url ).toString();

}
Expand Down
Loading