У меня есть код для определения широты и долготы, и этот код работает на локальном сервере, но не работает на реальном сервере, почему?
<body>
<td align="center">{{res.product_id.Arabic_name}}</td>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href='/static/style/file.css'/>
<br><br><br>
<div align="center" style="width=40%" id="bt">
<p><a href="/start/1"><button class="dropbtn" >العربية</button></a></p>
<p><a href="/start/4"><button class="dropbtn">Türk</button></a></p>
<p><a href="/start/2"><button class="dropbtn">ENGLISH</button></a></p>
<p><a href="/start/3"><button class="dropbtn">Русский</button></a></p>
</div>
<center><h2 id="loc" style="visibility:hidden">أنت بعيد عن المقهى يرجى
التواجد في المقهى لتشغيل النظام</h2></center>
<p name="lat" id="demo" style="visibility:hidden" ></p>
<p name="long" id="demo1" style="visibility:hidden"></p>
<script>
var x = document.getElementById("demo");
var y = document.getElementById("demo1");
if (navigator.geolocation) {
navigator.geolocation.getCurrentPosition(showPosition);
} else {
x.innerHTML = "Geolocation is not supported by this browser.";
}
function showPosition(position) {
x.innerHTML = position.coords.latitude
y.innerHTML= position.coords.longitude;
var L=position.coords.latitude
var K=position.coords.longitude;
if ((L !=21.556428800000003)||(K!=39.211827199999995)) {
document.getElementById("bt").style.display = 'none';
document.getElementById("loc").style.visibility = 'visible';
}
}
</script>
</body>
{% endblock %}
</html>