I have created a geolocation javascript code that detects the user location based on the navigator variable.
The location check is done based on the permissions the user currently has.
I check the navigator.permissions.query({name: 'geolocation'}) and based on the granted|prompt|denied results, I make a navigator.geolocation.getCurrentPosition query or a fallback API request.
My problem here is that on IOS devices, Safari browser, the navigator.permissions is undefined.
If I make a direct navigator.geolocation.getCurrentPosition query then the "allow location on device" prompt is always opening which is something I do not want.
Only if the user has already allowed the use of location and the status is granted I will make a position query.
In case the permission is on denied state, there is an "Allow Location" button that on click, the navigator prompt will happen.
It works flawlessly on desktop/Android devices, but on IOS we cannot use navigator.permissions variable and we do not want our users to be prompted to "allow location" on the website entry.
Some of the code for reference:
if (navigator.permissions) {
permissionsIsActive = true;
}
......
if (permissionsIsActive){
makePermissionsQuery();
}else{
makePositionQuery();
}
......
var makePositionQuery = function () {
navigator.geolocation.getCurrentPosition(function (devicePos) {
isAccurate = true;
position = {
lat: parseFloat(devicePos.coords.latitude),
lng: parseFloat(devicePos.coords.longitude)
}
//inject granted status as this is an if dependent variable
//so we make sure its in place for the prompt statement
permissionsStatus = 'granted';
isFinished = true;
},function () {
handleGeoError();
});
}
......
var makePermissionsQuery = function() {
navigator.permissions.query({name: 'geolocation'}).then(function (result) {
permissionsStatus = result.state;
switch (result.state) {
case "granted":
makePositionQuery();
break;
case "prompt":
handleGeoError();
break;
case "denied":
handleGeoError();
break;
}
});
}
So my question is, how can we detect the permission status on an IOS device, safari?
I am not sure if I messed or missed anything but any advice would be helpfull!