# Wms on demand with Geoserver

**URL:** <https://community.cesium.com/t/wms-on-demand-with-geoserver/25295>\
**Category:** CesiumJS\
**Created:** [July 11, 2023, 8:35am UTC](https://community.cesium.com/t/wms-on-demand-with-geoserver/25295 "2023-07-11T08:35:50Z")\
**Posts on this page:** 1\
**Page:** 1

<div class="post-metadata">

**Author:** ![Guibal\_Nicolas](https://sea2.discourse-cdn.com/cesium/user_avatar/community.cesium.com/guibal_nicolas/32/14040_2.png) [@Guibal\_Nicolas](https://community.cesium.com/u/Guibal_Nicolas)\
**Post date:** [July 11, 2023, 8:35am UTC](https://community.cesium.com/t/wms-on-demand-with-geoserver/25295/1 "2023-07-11T08:35:50Z")

</div>

I’m making a webGIS app based on Cesium Js. I have a node js server for all the server logic, a tomcat server hosting Geoserver to be able to load WMS layer on Cesium.  
On my app I want to allow the user to visualize his own raster data (.tiff). So actually on the app the user can upload the data, all the information are saved into a database, the Geotiff goes to geoserver (thanks to geoserver RESTAPI) to make the WMS layer.  
But the problem I have now is that I want to show the wms layer on the Cesium map after the user upload the data.  
I know how to display wms on Cesium but when I make a function to get the geoserver layer info (stored in a postgresql database) and pass the info into the WMS function, nothing appears on the map.

Any though how to make appears wms on demand by the user ?

Here is my code for the wms function :

testWms = document.querySelector(‘#wms’)

// event to call on click the fetchLatestLayer function

testWms.addEventListener(‘click’, fetchLatestLayer);

// Function to add WMS layer to the Cesium map  
function addWMSLayer(storename, layername) {  
console.log(layername, storename)  
const provider = new Cesium.WebMapServiceImageryProvider({  
url: ‘[http://localhost:8080/geoserver/wms](http://localhost:8080/geoserver/wms)’,  
parameters: {  
format: ‘image/png’,  
transparent: ‘true’  
},  
layers: `${storename}:${layername}`

});

const imageryLayer = new Cesium.ImageryLayer(provider);  
viewer.imageryLayers.add(imageryLayer);

}

async function fetchLatestLayer() {  
try {  
const response = await axios.get(‘/latest-layer’);  
const { storename, layername } = response.data;  
console.log(‘Got latest layer:’, { storename, layername });  
addWMSLayer(storename, layername);  
} catch (error) {  
console.error(‘Error fetching latest layer:’, error);  
}  
}