HTML5 fournit l'API de géolocalisation, qui permet aux applications Web d'accéder à la localisation géographique de l'utilisateur. L'API de géolocalisation est basée sur la spécification de l'API de géolocalisation du W3C.

Voici un exemple simple de la façon dont vous pouvez utiliser l'API de géolocalisation en HTML5 :

  1. Vérifiez la prise en charge de la géolocalisation : avant d'utiliser l'API de géolocalisation, c'est une bonne idée de vérifier si le navigateur la prend en charge.

    HTML
    <script> if ("geolocation" in navigator) { // Geolocation is supported // Your code for using the Geolocation API goes here } else { // Geolocation is not supported alert("Geolocation is not supported in this browser"); } </script>
  2. Obtenir la position de l'utilisateur : si la géolocalisation est prise en charge, vous pouvez utiliser la méthode navigator.geolocation.getCurrentPosition() pour obtenir la position actuelle de l'utilisateur.

    HTML
    <script> if ("geolocation" in navigator) { navigator.geolocation.getCurrentPosition(successCallback, errorCallback); } else { alert("Geolocation is not supported in this browser"); } function successCallback(position) { // The user's location is available in the 'position' object var latitude = position.coords.latitude; var longitude = position.coords.longitude; // Do something with the latitude and longitude console.log("Latitude: " + latitude); console.log("Longitude: " + longitude); } function errorCallback(error) { // Handle errors console.error("Error getting geolocation: " + error.message); } </script>

    La fonction successCallback est appelée lorsque l'emplacement est récupéré avec succès, et la fonction errorCallback est appelée en cas d'erreur.

  3. Gestion des erreurs : la fonction errorCallback peut gérer diverses erreurs et les informations sur l'erreur sont disponibles dans le paramètre error . Les erreurs courantes incluent l'autorisation refusée, la position indisponible et le délai d'attente.

    javascript
    function errorCallback(error) { switch (error.code) { case error.PERMISSION_DENIED: console.error("User denied the request for Geolocation."); break; case error.POSITION_UNAVAILABLE: console.error("Location information is unavailable."); break; case error.TIMEOUT: console.error("The request to get user location timed out."); break; default: console.error("An unknown error occurred."); break; } }

N'oubliez pas que certains utilisateurs peuvent choisir de ne pas partager leur position. Votre application doit donc être prête à gérer des scénarios dans lesquels la position n'est pas disponible.

Veuillez noter que l'accès à l'emplacement de l'utilisateur nécessite généralement un contexte sécurisé (c'est-à-dire que la page doit être servie via HTTPS). Si votre site est servi via HTTP, le navigateur peut ne pas autoriser l'accès à l'API de géolocalisation.