Article Categories
- All Categories
-
Data Structure
-
Networking
-
RDBMS
-
Operating System
-
Java
-
MS Excel
-
iOS
-
HTML
-
CSS
-
Android
-
Python
-
C Programming
-
C++
-
C#
-
MongoDB
-
MySQL
-
Javascript
-
PHP
-
Economics & Finance
Chrome and HTML5 GeoLocation denial callback
When using HTML5 Geolocation API in Chrome, users can deny location access or the request can timeout. Here's how to handle these scenarios properly.
The Challenge
Chrome's geolocation behavior can be unpredictable when users deny permission or when requests timeout. The callbacks might not always fire as expected, requiring additional timeout handling.
Basic Error Handling
The geolocation API accepts success and error callbacks:
<html>
<head>
<title>Geolocation Example</title>
</head>
<body>
<script>
function successCallback(position) {
console.log('Latitude: ' + position.coords.latitude);
console.log('Longitude: ' + position.coords.longitude);
}
function errorCallback(error) {
switch(error.code) {
case error.PERMISSION_DENIED:
console.log("User denied geolocation request");
break;
case error.POSITION_UNAVAILABLE:
console.log("Location information unavailable");
break;
case error.TIMEOUT:
console.log("Location request timed out");
break;
}
}
navigator.geolocation.getCurrentPosition(
successCallback,
errorCallback,
{timeout: 5000, enableHighAccuracy: true}
);
</script>
</body>
</html>
Enhanced Solution with Manual Timeout
For better reliability across Chrome versions, implement a manual timeout mechanism:
<html>
<head>
<title>Enhanced Geolocation</title>
</head>
<body>
<script>
let callbackExecuted = false;
function successCallback(position) {
if (callbackExecuted) return;
callbackExecuted = true;
console.log('Location obtained successfully');
console.log('Latitude: ' + position.coords.latitude);
console.log('Longitude: ' + position.coords.longitude);
}
function errorCallback(error) {
if (callbackExecuted) return;
callbackExecuted = true;
console.log('Geolocation error occurred');
console.log('Error code: ' + error.code);
console.log('Error message: ' + error.message);
}
// Manual timeout fallback
setTimeout(function() {
if (!callbackExecuted) {
callbackExecuted = true;
console.log('Geolocation request ignored or timed out');
}
}, 10000);
// Request location
navigator.geolocation.getCurrentPosition(
successCallback,
errorCallback,
{
timeout: 8000,
enableHighAccuracy: true,
maximumAge: 300000
}
);
</script>
</body>
</html>
Error Types
| Error Code | Constant | Description |
|---|---|---|
| 1 | PERMISSION_DENIED | User denied location access |
| 2 | POSITION_UNAVAILABLE | Location information unavailable |
| 3 | TIMEOUT | Request timed out |
Best Practices
Always implement both error handling and manual timeout. Set reasonable timeout values (5-10 seconds) and provide clear user feedback. Test across different Chrome versions to ensure consistent behavior.
Conclusion
Chrome's geolocation API requires robust error handling and manual timeout mechanisms. Use callback flags to prevent duplicate executions and provide meaningful user feedback for all scenarios.
228 Views
