Local tile server , is not showing data from WAN

Hi Guys,

I have successfully installed and setup a tile server with following guide : https://switch2osm.org/serving-tiles/manually-building-a-tile-server-18-04-lts/

Loaded a data for specific region and everything is working OK. However, when i try to access the data from outside, the tile's are not shown.

To be more specific on my firewall i've set up a NAT rule whenever i receive a request on port 10780, my PUBLIC_IP:10780 to forward the request to my tile server on HTTP port. Request is forwarded however on the browser nothing is shown, there're no errors in the apache's log and in the server , everything seems fine with the request its coming to the server, since i can see the public IP of the request in the access log of the apache, only with developer tools i got the following :

alt text

I am using leaflet file and the content of the file is as below :

<!DOCTYPE html>
<html style="height:100%;margin:0;padding:0;">
<title>Leaflet page with OSM render server selection</title>
<meta charset="utf-8">
<link rel="stylesheet" href="https://unpkg.com/leaflet@1.3/dist/leaflet.css" />
<script src="https://unpkg.com/leaflet@1.3/dist/leaflet.js"></script>
<script src="https://unpkg.com/leaflet-hash@0.2.1/leaflet-hash.js"></script>
<style type="text/css">
.leaflet-tile-container { pointer-events: auto; }
</style>
</head>
<body style="height:100%;margin:0;padding:0;">
<div id="map" style="height:100%"></div>
<script>
//<![CDATA[
var map = L.map('map').setView([47.3686498, 8.5391825], 18);

L.tileLayer('http://192.168.155.107/hot/{z}/{x}/{y}.png', {
    attribution: '&copy; <a href="https://www.openstreetmap.org/copyright">OpenStreetMap</a> contributors'
}).addTo(map);

var hash = L.hash(map)
//]]>
</script>
</body>
</html>
index.html (END)

If i browse the server within my LAN , http://192.168.155.107/ everything is fine, however from outside the tile's are not shown. Can someone help with this , or had similar situation what i need to do in order to access the tile server from outside.

Thanks in advance guys.

asked 17 Feb '21, 13:03

DavorB0
22●4●4●5
accept rate: 0%

edited 17 Feb '21, 13:38

scai ♦
33.3k●21●309●459

You need to use an address that can be reached from the outside. 192.168.155.107 is a private address which probably can't be reached from the outside of your LAN, certainly not from the Internet.

(17 Feb '21, 13:09) scai ♦

@Scai i am using my http://${PUBLIC_IP}:{PORT} to access the server. I am achieving this with NAT (network address translation) rule set on the firewall , example i am browsing http://44.44.44.44:10780 , once the request comes to my firewall its forwarded to the local server 192.168.155.107 on port 80 which apache accepts it. This is not an issue, the request goes without issues, afterwards tile's are not shown for some reason.

(17 Feb '21, 13:24) DavorB0

Still, your index.html refers to 192.168.155.107. Therefore your browser tries to contact 192.168.155.107 as can be seen in the screenshot. Your browser doesn't know that 192.168.155.107 is located behind 44.44.44.44:10780. You either need to replace 192.168.155.107 with your public IP address and port (not really a good solution in this case, since both the index.html and the tiles seem to be located on the same machine) or you need to specify a relative URL to your tiles instead of an absolute one.

(17 Feb '21, 13:39) scai ♦

@Scai thank you for the hint and the explanation, it did help. Once i changed the leaflet as per your instruction, it worked as a charm.

Additionally, outbound rule needed to be configured on the Linux machine where the tile's are hosted.

Thanks again for the help.

(18 Feb '21, 13:26) DavorB0

Follow this question

By Email:

Once you sign in you will be able to subscribe for any updates here

By RSS:

Answers

Answers and Comments

Markdown Basics

*italic* or _italic_
**bold** or __bold__
link:[text](http://url.com/ "title")
image?![alt text](/path/img.jpg "title")
numbered list: 1. Foo 2. Bar
to add a line break simply add two spaces to where you would like the new line to be.
basic HTML tags are also supported

learn more about Markdown

Question tags:

osm ×710
tiles ×287
leaflet ×74
public ×17

question asked: 17 Feb '21, 13:03

question was seen: 1,379 times

last updated: 18 Feb '21, 13:43

Local tile server , is not showing data from WAN

Follow this question

Related questions