CONTATTACI

Blog

API di geolocalizzazione e JavaScript: come ottenere la posizione di un utente

Se si ambisce a diventare web developer, è necessario, nel proprio bagaglio, la conoscenza del linguaggio JavaScript. Imparare JavaScript è una delle pratiche più importanti da attuare per intraprendere la carriera da sviluppatore per il web. Saper programmare in JavaScript diventa fondamentale per tutti gli aspiranti programmatori web.

JavaScript  cos è?

Si tratta di un linguaggio di scripting utilizzato per rendere i siti web dinamici. Fa parte dei tre linguaggi base per lo sviluppo web, insieme a HTML e CSS. Infatti, JavaScript gestisce il comportamento degli elementi dinamici di un sito web, come il contenuto (HTML) e lo stile grafico (CSS) reagiscono e si modificano sulla pagina web.

La programmazione JavaScript passa attraverso una serie di conoscenze, necessarie, strettamente correlate al linguaggio. Come la sintassi, la programmazione orientata agli eventi o l’implementazione, nello sviluppo web

In questo articolo vedremo come ottenere la posizione di un utente tramite API. Spesso molte applicazioni richiedono di accedere alla posizione dell’utente, come ad esempio le app di food delivery, oppure le applicazioni di car sharing/prenotazione di taxi. Per farlo useremo L'API di geolocalizzazione, che rapparesenta una soluzione semplice. Si può usare non solo per determinare la posizione degli utenti, ma anche la valuta locale, la lingua e altre informazioni utili. Le web API service sono spesso impiegate nello sviluppo web per ottenere informazioni utili dall’utente.

Ma prima, approfondiamo. API rest cosa sono?

Un'API REST, nota anche come API RESTful, è un'interfaccia di programmazione delle applicazioni (API o API web) conforme ai vincoli dello stile architetturale REST, che consente l'interazione con servizi web RESTful. Il termine REST, è l'acronimo di REpresentational State Transfer. Il REST è un sistema di trasmissione dei dati grazie che utilizza l’HTTP e che fa uso delle funzioni HTTP, ricorrendo ai comandi GET, POST, PUT, PATCH, DELETE e OPTIONS.

Dopo aver approfondito le REST API cosa sono (o RESTful API), andiamo più nello specifico, analizzando l’API di geolocalizzazione. L'API di geolocalizzazione nel linguaggio JavaScript fornisce l'accesso ai dati sulla posizione geografica associati al dispositivo di un utente. Questo può essere determinato utilizzando GPS, WIFI, geolocalizzazione IP e così via.

Per proteggere la privacy dell'utente, richiede il permesso di localizzare il dispositivo. Se l'utente concede l'autorizzazione, avrai accesso ai dati sulla posizione come latitudine, longitudine, altitudine e velocità. Otterrai anche l'accuratezza dei dati sulla posizione acquisiti e l'ora approssimativa in cui è stata acquisita la posizione. Come usare questa API di geolocalizzazione?

Puoi accedere all'API di geolocalizzazione chiamando l'oggetto navigator.geolocation. Questo comando concede all'app l'accesso alla posizione del dispositivo. Mentre l’oggetto fornisce i metodi elencati di seguito per lavorare con la posizione del dispositivo:

  • getCurrentPosition: restituisce la posizione corrente del dispositivo.
  • watchPosition: una funzione di gestione che viene richiamata automaticamente quando cambia la posizione del dispositivo.

Ci sono tre possibili argomenti associati a questi metodi:

  • Un callback positivo (richiesto)
  • Una callback di errore (opzionale)
  • Un oggetto opzionale (facoltativo)

Vediamo ora come utilizzare il getCurrentPosition(). Con il metodo getCurrentPosition si può ottenere la posizione corrente dell'utente. Invia una richiesta asincrona al browser, chiedendo il consenso per condividere la loro posizione.

Ecco la sintassi nel linguaggio JavaScript per ottenere la posizione di un utente:

 1. const successCallback = (position) => {
 2.   console.log(position);
 3. };
 4.  
 5. const errorCallback = (error) => {
 6.   console.log(error);
 7. };
 8.  
 9. navigator.geolocation.getCurrentPosition(successCallback, errorCallback);

Quando esegui questo pezzo di codice, ti verrà mostrata una finestra popup dal browser per richiedere i permessi per concedere la tua posizione attuale.

Acconsentendo si aprirà la console per sviluppatori. Vedrai che la chiamata alla funzione restituisce due cose:
 

  • Oggetto GeolocationPosition.coords: rappresenta la posizione, l'altitudine e la precisione con cui il dispositivo calcola queste proprietà.
  • timestamp: rappresenta l'ora in cui è stata ottenuta la posizione.
     

Osservando il log della console avremo a disposizione tutti i dati ottenuti dalla chiamata alla rest-API. Dopo aver fatto ciò possiamo tracciare l’utente guardando la sua posizione.

Il metodo watchPosition() consente all'app di monitorare continuamente l'utente aggiornandosi man mano che la sua posizione cambia. Lo fa installando una funzione di gestione che verrà chiamata automaticamente ogni volta che la posizione del dispositivo dell'utente cambia.

Ecco la sintassi in JavaScript, dove id è fondamentalmente utilizzato per gestire o fare riferimento al metodo precedentemente citato:

1. const id = navigator.geolocation.watchPosition(successCallback, errorCallback);

Per interrompere il monitoraggio della posizione, basterà utilizzare il metodo clearWatch().

1. navigator.geolocation.clearWatch(id);

Sebbene l'oggetto options sia facoltativo, fornisce parametri che consentono di ottenere risultati più accurati, ad esempio:

 1. const options = {
 2.   enableHighAccuracy: true,
 3.   timeout: 10000,
 4. };
 5.  
 6. navigator.geolocation.getCurrentPosition(
 7.   successCallback,
 8.   errorCallback,
 9.   options
10. );

 

Nel codice riportato, abbiamo specificato che:

  • La risposta dovrebbe fornire una posizione più precisa, impostando enableHighAccuracy su true.
  • Il tempo massimo (in millisecondi) che il dispositivo può impiegare per restituire una posizione. In questo caso, 10 secondi (timeout).

 

Questo breve tutorial ti ha mostrato le potenzialità del linguaggio Javascript: cosa aspetti? Corri ad approfondire con la nostra guida Javascript in italiano!

Articoli correlati

Il linguaggio HTML (Hypertext Markup Language) è uno dei più conosciuti e diffusi: lo si trova infatti praticamente in tutte le pagine web esistenti. È una scelta popolare tra i principianti che si…

Seguici su Facebook

Vuoi entrare nel mondo della programmazione?

Scopri di più sui nostri corsi!

Chiamaci al numero verde

Contattaci su WhatsApp

Contattaci senza impegno per informazioni sul corso

Pagamento rateale

Valore della rata: A PARTIRE DA 115 €/mese.

Esempio di finanziamento 

Importo finanziato: € 2440 in 24 rate da € 115 – TAN fisso 9,55% TAEG 12,57% – importo totale del credito € 2841.

Il costo totale del credito comprende: interessi calcolati al TAN indicato, oneri fiscali (imposta di bollo sul contratto 16,00 euro*) addebitati sulla prima rata, costo mensile di gestione pratica € 3,90, spesa di istruttoria € 0,00, spesa per invio rendicontazione periodica cartacea € 0,98 (o spesa per invio rendicontazione periodica cartacea € 0,00), imposta di bollo su rendicontazione periodica € 0,00. Modalità di rimborso obbligatoria: addebito diretto su c/c. La scadenza delle rate è determinata dal giorno della liquidazione del contratto; la data di scadenza delle rate è prevista il giorno 15 del mese. L’importo di ciascuna rata comprende una quota di capitale crescente e interessi decrescente secondo un piano di ammortamento “alla francese”. Offerta valida dal 01/01/2024 al 31/12/2024.

Messaggio pubblicitario con finalità promozionale. Per le informazioni precontrattuali richiedere sul punto vendita il documento “Informazioni europee di base sul credito ai consumatori” (SECCI) e copia del testo contrattuale. Salvo approvazione di Sella Personal Credit S.p.A. Aulab S.r.l. opera quale intermediario del credito NON in esclusiva.

*In fase di richiesta del finanziamento verrà proposta la facoltà di selezionare, in alternativa all’imposta di bollo sul contratto di 16,00 euro, l’imposta sostitutiva, pari allo 0,25% dell’importo finanziato.

Pagamento rateale

Valore della rata: A PARTIRE DA 210 €/mese.

Esempio di finanziamento  

Importo finanziato: € 4500 in 24 rate da € 210,03 – TAN fisso 9,68% TAEG 11,97% – importo totale del credito € 5146,55.

Il costo totale del credito comprende: interessi calcolati al TAN indicato, oneri fiscali (imposta di bollo sul contratto 16,00 euro*) addebitati sulla prima rata, costo mensile di gestione pratica € 3,90, spesa di istruttoria € 0,00, spesa per invio rendicontazione periodica cartacea € 0,98 (o spesa per invio rendicontazione periodica cartacea € 0,00), imposta di bollo su rendicontazione periodica € 0,00. Modalità di rimborso obbligatoria: addebito diretto su c/c. La scadenza delle rate è determinata dal giorno della liquidazione del contratto; la data di scadenza delle rate è prevista il giorno 15 del mese. L’importo di ciascuna rata comprende una quota di capitale crescente e interessi decrescente secondo un piano di ammortamento “alla francese”. Offerta valida dal 01/01/2024 al 31/12/2024.

Messaggio pubblicitario con finalità promozionale. Per le informazioni precontrattuali richiedere sul punto vendita il documento “Informazioni europee di base sul credito ai consumatori” (SECCI) e copia del testo contrattuale. Salvo approvazione di Sella Personal Credit S.p.A. Aulab S.r.l. opera quale intermediario del credito NON in esclusiva.

* In fase di richiesta del finanziamento verrà proposta la facoltà di selezionare, in alternativa all’imposta di bollo sul contratto di 16,00 euro, l’imposta sostitutiva, pari allo 0,25% dell’importo finanziato.

Contattaci senza impegno per informazioni sul corso

Scopriamo insieme se i nostri corsi fanno per te. Compila il form e aspetta la chiamata di uno dei nostri consulenti.