If I understand you correctly, you want to fetch the images from the same host, but different port.

You could use the URL API for that:

const url = new URL(window.location.origin)
url.port = 9090

console.log(url)

I have built a spring boot web application. It is hosted on a tomcat server on port 80.

For loading the images from the server dynamically, I’m using apache server provided by xampp. All the images are accessed on port 9090.

In my web application code, I’m loading the images with localhost:9090 in the url as shown below.

<img th_src="@{${'http://localhost:9090/COVID/DD/' + item.imageFileName}}" class="card-img-top rounded-0"  />

Problem: Since the url path is of localhost, the images are not loaded when I’m using the public ip of the server to view the web application.

How can I fetch the images from port 9090 without hardcoding the host as localhost?