I'm building a service to record website visitors geolocation using the HTML5 geolocation API. The problem is that I want to record only the first time the visitor give permission to the geolocation API. The API provides the following method to retrieve the location:
if (navigator.geolocation) {
navigator.geolocation.getCurrentPosition(saveToDatabase);
} else {
x.innerHTML = "Geolocation is not supported by this browser.";
}
But if I save the location inside the saveToDatabase function I'm going to record every time this is requested, not when the user give permission.
I expect I can save the first geolocation requested to the user. Anyway I can accomplish this?
var date = null;
if (navigator.geolocation) {
if (date != null) {
date = Date.now();
}
navigator.geolocation.getCurrentPosition(saveToDatabase);
} else {
x.innerHTML = "Geolocation is not supported by this browser.";
}
Related
im building an app through phonegap, with a geolocation button.
if a user denies permission for geolocation the first time, how can i ask for permission again when they click the geolocation button again?
my code structure at the moment is:
function getLocation() {
if(navigator.geolocation) {
navigator.geolocation.getCurrentPosition(showPosition, positionError);
} else {
hideLoadingDiv()
showError('Geolocation is not supported by this device')
}
}
function positionError() {
hideLoadingDiv()
showError('Geolocation is not enabled. Please enable to use this feature')
}
You can't.
The only thing you can do is to display the instructions to reactivate the location sharing in his browser's settings (https://support.google.com/chrome/answer/142065?hl=en).
Two ways of doing this:
If you have a version of Chrome bigger than 83.0.4103.97 then use the lock icon in the URL
For older versions of Chrome the bellow code will work fine:
The bellow code only works on Chrome.
Steps:
Open Chrome
Open the console
Copy in the console
var allowGeoRecall = true;
var countLocationAttempts = 0;
Copy in the console the functions
function getLocation() {
console.log('getLocation was called')
if(navigator.geolocation) {
navigator.geolocation.getCurrentPosition(showPosition,
positionError);
} else {
hideLoadingDiv()
console.log('Geolocation is not supported by this device')
}
}
function positionError() {
console.log('Geolocation is not enabled. Please enable to use this feature')
if(allowGeoRecall && countLocationAttempts < 5) {
countLocationAttempts += 1;
getLocation();
}
}
function showPosition(){
console.log('posititon accepted')
allowGeoRecall = false;
}
Run the function in the console
getLocation();
After running this you will be asked to allow to share your position. If your response is negative you will be asked again until you agree.
HINT: If your user has a negative response, let him know why you need the coordinates. Is vital for him to understand that this step is vital for the good run of the web app.
This can be reset in Page Info which can be accessed by clicking the lock icon next to the URL and allowing Location
Here is my javascript code :
function getLocation() {
//navigator.geolocation.getCurrentPosition(getCoor, errorCoor, {maximumAge:60000, timeout:30000, enableHighAccuracy:true});
var mobile =jQuery.browser.mobile;
var deviceAgent = navigator.userAgent.toLowerCase();
var agentID = deviceAgent.match(/(iphone|ipod|ipad)/);
if(mobile){
watchLocation(function(coords) {
var latlon = coords.latitude + ',' + coords.longitude;
//some stuff
}, function() {
alert("error");
});
} else {
if (navigator.geolocation) {
navigator.geolocation.getCurrentPosition(showPosition);
} else {
alert("error");
}
}
}
function watchLocation(successCallback, errorCallback) {
successCallback = successCallback || function(){};
errorCallback = errorCallback || function(){};
// Try HTML5-spec geolocation.
var geolocation = navigator.geolocation;
if (geolocation) {
// We have a real geolocation service.
try {
function handleSuccess(position) {
alert("position:"+position.coords);
successCallback(position.coords);
}
geolocation.watchPosition(handleSuccess, errorCallback, {
enableHighAccuracy: true,
maximumAge: 5000 // 5 sec.
});
} catch (err) {
errorCallback();
}
} else {
errorCallback();
}
}
I have tried both getCurrentPosition and watchPosition.
It's reaching errorCalback() method when control comes to geolocation.watchPosition line.
I am testing in Motorola G 2nd Gen with Android 6 and Google chrome browser and opera mini.
Update 1: When I put alert in error call back function I got error:1; message:Only Secure origins are allowed(see:link).
navigator.geolocation.getCurrentPosition(showPosition, function(e)
{ alert(e); //alerts error:1; message:Only Secure origins are allowed(see: )
console.error(e);
})
Update 2: With the help from g4s8 I am able to findout that the error is because of insecure URL. i.e only accessing with http instead of https.But then also I bypassed that in browser by clicking advanced button.But it will prompt for Do you want to allow location, which I don't want..is there any way to access location without prompting it?
Your page should be served over https to access geolocation API.
See Geolocation API Removed from Unsecured Origins
Starting with Chrome 50, Chrome no longer supports obtaining the user's location using the HTML5 Geolocation API from pages delivered by non-secure connections
...
It is an important issue as it will directly impact any site that requires use of the geolocation API and is not served over https
To fix this serve your page over https or on localhost.
Thank you...Is there any way to bypass it??
You can try to use some geolocation services, e.g.
geoip2, Geolocation request
how to use them? can you show an example?? from those two can i access user location without knowing them?
GeoIP2 detect you location by ip address. You can obtain country (geoip2.country()) and city (geoip2.city) with js lib:
<script src="//js.maxmind.com/js/apis/geoip2/v2.1/geoip2.js" type="text/javascript"></script>
Here https://dev.maxmind.com/geoip/geoip2/javascript/ you can find full documentation.
Google maps geolocation is google service, so you need to get api key first. Then you can send POST request with json parameters to https://www.googleapis.com/geolocation/v1/geolocate?key=API_KEY and get the response:
{
"location": {
"lat": 51.0,
"lng": -0.1
},
"accuracy": 1200.4
}
where location is the user’s estimated latitude and longitude, in degrees,
and accuracy is the accuracy of the estimated location, in meters.
Full json parameters defenition you can find in "Request body" section here https://developers.google.com/maps/documentation/geolocation/intro#overview
Also you can find useful those answers: getCurrentPosition() and watchPosition() are deprecated on insecure origins
using IP it provides only country and city..??
Yes, only this.
will it provide physical location like how getCurrent Position provides??
No, you can't get physical location, because it can be accessed only via gelocation API, that was restricted in insecure context.
Also you have one more option. You can host only one page (that access geolocation API) on https server, and redirect from this page to your http site with user location in get parameters.
/* https page */
navigator.geolocation.getCurrentPosition(function (result) {
window.location.href = "http://your.site.com/http-page?lat=" + result.latitude + "&long=" + result.longitude;
});
I am currently developing app that is 2 part:
1st part is truck driving app that drivers take with them when making deliveries to read order info's and such (they are using tablets that run android)
2nd part is monitoring app for managers to monitor statuses of deliveries and such (they are using computers)
I want to implement GPS tracking now on both sides. I know I can get Lat and Len of drivers and wrap it into setInterval to get (for example) every 3 secs, like so:
setInterval(function(){
function getLocation() {
if (navigator.geolocation) {
navigator.geolocation.getCurrentPosition(showPosition);
} else {
x.innerHTML = "Geolocation is not supported by this browser.";
}
}
}, 3000);
function showPosition(position) {
x.innerHTML = "Latitude: " + position.coords.latitude +
"<br>Longitude: " + position.coords.longitude;
}
My only issue here is will this process persist if drivers lock their phones or even minimize browser.
Over all, is this good solution?
I have an Android app which gets the user's location (latitude and longitude). The latitude and longitude is used to query a database via a web service.
I am in the process of developing a website which will be another gateway into the backend. In order to make the website useful I need to get the latitude and longitude of the user, as the results are sorted by distance (i.e. distance from user's location to location of returned data which is a bar/restaurant).
So how do I get the latitude and longitude of the user?
It is not possible via PHP directly although if you are creating a website you can use the javascript geolocation API to query the browser about what it knows about the users current location:
<script>
var x = document.getElementById("demo");
function getLocation() {
if (navigator.geolocation) {
navigator.geolocation.getCurrentPosition(showPosition);
} else {
x.innerHTML = "Geolocation is not supported by this browser.";
}
}
function showPosition(position) {
x.innerHTML = "Latitude: " + position.coords.latitude + "<br>Longitude: " + position.coords.longitude;
}
</script>
I have simply copied the code example from w3 schools vertabrim.
Source:
http://www.w3schools.com/html/html5_geolocation.asp
im building an app through phonegap, with a geolocation button.
if a user denies permission for geolocation the first time, how can i ask for permission again when they click the geolocation button again?
my code structure at the moment is:
function getLocation() {
if(navigator.geolocation) {
navigator.geolocation.getCurrentPosition(showPosition, positionError);
} else {
hideLoadingDiv()
showError('Geolocation is not supported by this device')
}
}
function positionError() {
hideLoadingDiv()
showError('Geolocation is not enabled. Please enable to use this feature')
}
You can't.
The only thing you can do is to display the instructions to reactivate the location sharing in his browser's settings (https://support.google.com/chrome/answer/142065?hl=en).
Two ways of doing this:
If you have a version of Chrome bigger than 83.0.4103.97 then use the lock icon in the URL
For older versions of Chrome the bellow code will work fine:
The bellow code only works on Chrome.
Steps:
Open Chrome
Open the console
Copy in the console
var allowGeoRecall = true;
var countLocationAttempts = 0;
Copy in the console the functions
function getLocation() {
console.log('getLocation was called')
if(navigator.geolocation) {
navigator.geolocation.getCurrentPosition(showPosition,
positionError);
} else {
hideLoadingDiv()
console.log('Geolocation is not supported by this device')
}
}
function positionError() {
console.log('Geolocation is not enabled. Please enable to use this feature')
if(allowGeoRecall && countLocationAttempts < 5) {
countLocationAttempts += 1;
getLocation();
}
}
function showPosition(){
console.log('posititon accepted')
allowGeoRecall = false;
}
Run the function in the console
getLocation();
After running this you will be asked to allow to share your position. If your response is negative you will be asked again until you agree.
HINT: If your user has a negative response, let him know why you need the coordinates. Is vital for him to understand that this step is vital for the good run of the web app.
This can be reset in Page Info which can be accessed by clicking the lock icon next to the URL and allowing Location