Geolocation API JavaScript

Edoardo Midali
Edoardo Midali

La Geolocation API permette alle applicazioni web di accedere alla posizione geografica dell’utente. Questa API del browser fornisce informazioni come latitudine, longitudine, altitudine e precisione, sempre previo consenso esplicito dell’utente per motivi di privacy.

Come Funziona la Geolocation

La Geolocation API è accessibile tramite navigator.geolocation e funziona utilizzando diverse fonti per determinare la posizione: GPS (sui dispositivi mobili), reti Wi-Fi, torri cellulari e indirizzi IP. La precisione varia a seconda della tecnologia disponibile e delle impostazioni del dispositivo.

if ("geolocation" in navigator) {
  console.log("Geolocation è disponibile");
} else {
  console.log("Geolocation non è supportata");
}

È importante verificare sempre se la funzionalità è disponibile prima di utilizzarla, poiché non tutti i browser o dispositivi la supportano.

Ottenere la Posizione Corrente

Il metodo principale per ottenere la posizione dell’utente è getCurrentPosition(). Questo metodo è asincrono e richiede una funzione di callback per gestire il risultato:

navigator.geolocation.getCurrentPosition(
  function (position) {
    const lat = position.coords.latitude;
    const lon = position.coords.longitude;
    const precisione = position.coords.accuracy;

    console.log(`Posizione: ${lat}, ${lon}`);
    console.log(`Precisione: ${precisione} metri`);
  },
  function (error) {
    console.log("Errore nel recupero della posizione:", error.message);
  }
);

La funzione di successo riceve un oggetto Position che contiene le coordinate e altre informazioni utili come la precisione, l’altitudine (se disponibile) e il timestamp della rilevazione.

Gestione degli Errori

La Geolocation API può fallire per diversi motivi: permesso negato dall’utente, posizione non disponibile, timeout della richiesta. È fondamentale gestire questi errori appropriatamente:

function gestisciErrore(error) {
  switch (error.code) {
    case error.PERMISSION_DENIED:
      console.log("L'utente ha negato il permesso");
      break;
    case error.POSITION_UNAVAILABLE:
      console.log("Informazioni sulla posizione non disponibili");
      break;
    case error.TIMEOUT:
      console.log("Timeout della richiesta");
      break;
    default:
      console.log("Errore sconosciuto");
      break;
  }
}

navigator.geolocation.getCurrentPosition(function (position) {
  /* gestisci successo */
}, gestisciErrore);

Ogni tipo di errore richiede una gestione diversa: per il permesso negato potresti voler spiegare perché la funzionalità è necessaria, mentre per un timeout potresti riprovare automaticamente.

Opzioni di Configurazione

Il terzo parametro di getCurrentPosition() permette di configurare il comportamento della richiesta:

const opzioni = {
  enableHighAccuracy: true, // Richiede la massima precisione
  timeout: 10000, // Timeout di 10 secondi
  maximumAge: 300000, // Accetta cache fino a 5 minuti
};

navigator.geolocation.getCurrentPosition(
  successCallback,
  errorCallback,
  opzioni
);

enableHighAccuracy: Quando true, richiede la posizione più precisa possibile (GPS), ma consuma più batteria. timeout: Millisecondi massimi di attesa prima di considerare la richiesta fallita. maximumAge: Età massima in millisecondi di una posizione cached accettabile.

Monitoraggio Continuo della Posizione

Per applicazioni che necessitano di tracciare il movimento dell’utente (come app di navigazione), puoi utilizzare watchPosition():

const watchId = navigator.geolocation.watchPosition(
  function (position) {
    const lat = position.coords.latitude;
    const lon = position.coords.longitude;

    console.log(`Nuova posizione: ${lat}, ${lon}`);
    // Aggiorna la mappa o l'interfaccia
  },
  function (error) {
    console.log("Errore nel tracking:", error.message);
  },
  {
    enableHighAccuracy: true,
    timeout: 5000,
    maximumAge: 0, // Non accettare cache
  }
);

// Per fermare il monitoraggio
// navigator.geolocation.clearWatch(watchId);

Il monitoraggio continuo è utile per applicazioni fitness, navigatori o giochi basati sulla posizione, ma va usato con parsimonia per non scaricare la batteria.

Esempi Pratici

Mostrare la Posizione su Mappa

function mostraSuMappa(position) {
  const lat = position.coords.latitude;
  const lon = position.coords.longitude;

  // Esempio con link a Google Maps
  const urlMappa = `https://maps.google.com?q=${lat},${lon}`;

  const link = document.createElement("a");
  link.href = urlMappa;
  link.target = "_blank";
  link.textContent = "Visualizza su Google Maps";
  document.body.appendChild(link);
}

navigator.geolocation.getCurrentPosition(mostraSuMappa);

Calcolare Distanza da un Punto

function calcolaDistanza(lat1, lon1, lat2, lon2) {
  const R = 6371; // Raggio della Terra in km
  const dLat = ((lat2 - lat1) * Math.PI) / 180;
  const dLon = ((lon2 - lon1) * Math.PI) / 180;

  const a =
    Math.sin(dLat / 2) * Math.sin(dLat / 2) +
    Math.cos((lat1 * Math.PI) / 180) *
      Math.cos((lat2 * Math.PI) / 180) *
      Math.sin(dLon / 2) *
      Math.sin(dLon / 2);

  const c = 2 * Math.atan2(Math.sqrt(a), Math.sqrt(1 - a));
  return R * c; // Distanza in km
}

navigator.geolocation.getCurrentPosition(function (position) {
  const distanzaDaRoma = calcolaDistanza(
    position.coords.latitude,
    position.coords.longitude,
    41.9028,
    12.4964 // Coordinate di Roma
  );

  console.log(`Sei a ${distanzaDaRoma.toFixed(2)} km da Roma`);
});

Considerazioni di Privacy e Sicurezza

La Geolocation API richiede sempre il consenso dell’utente e funziona solo su connessioni sicure (HTTPS). Gli utenti possono revocare il permesso in qualsiasi momento dalle impostazioni del browser.

Best Practices per la Privacy:

  • Spiega chiaramente perché hai bisogno della posizione
  • Richiedi la posizione solo quando necessario
  • Non memorizzare le coordinate senza consenso esplicito
  • Offri funzionalità alternative se l’utente nega il permesso

Limitazioni Tecniche:

  • Precisione variabile (da metri a chilometri)
  • Potrebbe non funzionare in edifici o zone remote
  • Consumo della batteria con watchPosition()
  • Latenza nella prima rilevazione (cold start del GPS)

Supporto dei Browser e Alternative

La Geolocation API è ben supportata nei browser moderni, ma ha limitazioni su HTTP (solo HTTPS). Per applicazioni che richiedono posizionamento preciso, considera l’integrazione con servizi di mappe specializzati che offrono funzionalità aggiuntive come geocoding inverso e routing.

La API è ideale per funzionalità come “trova il negozio più vicino”, check-in geografici, app meteo localizzate e servizi di delivery. Tuttavia, per applicazioni mission-critical, è consigliabile avere sempre un fallback che non dipenda dalla geolocalizzazione.