In the previous post its not possible to get Geolocation with out using SSL connection or Domain Name.
OutPut:
<!DOCTYPE html>
<html>
<body>
<div style="width:40%">
<center>
<hr>
<p>Click on the below button to get your coordinates.</p>
<hr>
<button onclick="tryAPIGeolocation()" class="btn btn-primary">Get Location</button>
<hr>
<div id="div_gioloc" style="color:yellow; background-color: green; border-radius: 18px;"></div>
</center>
</div>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
<script>
var x = document.getElementById("div_gioloc");
x.innerHTML = "Latitude: 0 <br>Longitude: 0";
var apiGeolocationSuccess = function (position) {
x.innerHTML = "Latitude: '" + position.coords.latitude + "' <br>Longitude: '" + position.coords.longitude +
"'";
};
var tryAPIGeolocation = function () {
jQuery.post(
"https://www.googleapis.com/geolocation/v1/geolocate?key=AIzaSyDCa1LUe1vOczX1hO_iGYgyo8p_jYuGOPU",
function (success) {
apiGeolocationSuccess({
coords: {
latitude: success.location.lat,
longitude: success.location.lng
}
});
})
.fail(function (err) {
x.innerHTML = "API Geolocation error! <br><br>" + err;
});
};
var browserGeolocationSuccess = function (position) {
x.innerHTML = "Browser geolocation success!<br><br>Latitude = " + position.coords.latitude +
"<br>Longitude = " + position.coords
.longitude;
};
var browserGeolocationFail = function (error) {
switch (error.code) {
case error.TIMEOUT:
x.innerHTML = "Browser geolocation error !<br><br>Timeout.";
break;
case error.PERMISSION_DENIED:
if (error.message.indexOf("Only secure origins are allowed") == 0) {
tryAPIGeolocation();
}
break;
case error.POSITION_UNAVAILABLE:
// dirty hack for safari
if (error.message.indexOf("Origin does not have permission to use Geolocation service") == 0) {
tryAPIGeolocation();
} else {
x.innerHTML = "Browser geolocation error !<br><br>Position unavailable.";
}
break;
}
};
var tryGeolocation = function () {
if (navigator.geolocation) {
navigator.geolocation.getCurrentPosition(
browserGeolocationSuccess,
browserGeolocationFail, {
maximumAge: 50000,
timeout: 20000,
enableHighAccuracy: true
});
}
};
</script>
</body>
</html>
No comments:
Post a Comment