Utilize the following code in your web application or employ the navigator with a popup dialog:
var options = {
enableHighAccuracy: true,
timeout: 7000,
maximumAge: 0
};
function log(data) {
const tag = document.createElement('p');
tag.textContent = data;
document.body.appendChild(tag);
}
function success(pos) {
var crd = pos.coords;
console.log('Successfully determined a user position:', crd);
log('Your current position is:');
log(`Latitude : ${crd.latitude}`);
log(`Longitude: ${crd.longitude}`);
log(`More or less ${crd.accuracy} meters.`);
}
function error(err) {
console.warn(`ERROR(${err.code}): ${err.message}`);
}
navigator.geolocation.getCurrentPosition(success, error, options);
Alternatively,
$scope.watchId = navigator.geolocation.watchPosition(function (position) {
if ($scope.t1 == 0) {
$scope.t1 = position.timestamp;
} else {
if (Math.abs($scope.t1 - position.timestamp) > 5000) {
$scope.t1 = position.timestamp;
SellerRef.update({ Location: { Lat: position.coords.latitude, Long: position.coords.longitude } })
}
}
},
function (error) {
if (error.code == 1) {
$scope.showAlert("An error occured \n" + " Please goto Settings->Privacy->LocationServices and give permission for " + bowser.name + " which is your browser ");
}
}
);
If you want to load your web within an app,
To understand geolocation errors, refer to this link
navigator.geolocation.getCurrentPosition(success => {
/* Do some magic. */
}, failure => {
if (failure.message.startsWith("Only secure origins are allowed")) {
// Secure Origin issue.
}
});
Include/set a "required_features" option within the manifest.webapp file:
{
"required_features": ["geolocation"]
}
User:
On iPhone:
Settings -> Location Services -> [your Browser] [apple ref][1]
Chrome requires https for geolocation usage
Troubleshooting && Permissions Check / Debug Log
Ensure that both the OPERATING SYSTEM and BROWSER BOTH have location services enabled, and that the user's browser supports checking for location services
// options for current position
const navigatorLocationOptions = {
enableHighAccuracy: true,
timeout: 7000,
maximumAge: 0
};
// does browser have geo services enabled
navigator.permissions.query({name:'geolocation'})
.then((result) => {
if (result.state === 'granted') {// you are good
navigator.geolocation.getCurrentPosition(position => {
console.log('granted user location permission', position );
//.. do your stuff
}, (error) => {
// OS services are not enabled
console.log('Please turn on OS located services', navigator);
errorLocation();
}, navigatorLocationOptions);
} else {
// browser issues seriveces
console.log('Browser location services disabled', navigator);
errorLocation();
}
}, (error) => {
/* Browser doesn't support querying for permissions */
console.log('Please turn on BROWSER location services', navigator);
errorLocation()
}
);
//handle errors
function errorLocation() {
...
}