1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
305
306
307
308
309
310
311
312
313
314
315
316
317
318
319
320
321
|
---
title: Using geolocation
slug: Web/API/Geolocation/Using_geolocation
translation_of: Web/API/Geolocation_API
---
<p>{{securecontext_header}}{{APIRef("Geolocation API")}}</p>
<p>Le<strong> API per la geolocalizzazione</strong> permettono agli utenti di fornire la propria posizione alle applicazioni web. Per ragioni di privacy, all'utente viene richiesta l'autorizzazione all'uso della posizione.</p>
<h2 id="L'oggetto_della_geolocalizzazione">L'oggetto della geolocalizzazione</h2>
<p>Le API di geolocalizzazione sono pubblicate tramite l'oggetto {{domxref("navigator.geolocation")}}.</p>
<p>Se l'oggetto esiste, il servizio di geolocalizzazione è disponibile. Puoi testare l'esistenza dell'oggetto tramite:</p>
<pre class="brush: js">if ("geolocation" in navigator) {
/* la geolocalizzazione è disponibile */
} else {
/* la geolocalizzazione NON È disponibile */
}
</pre>
<div class="note">
<p><strong>Nota:</strong> Su Firefox 24 e versioni più vecchie, <code>"geolocation" in navigator</code> ritorna sempre <code>true</code> anche se l'API è stata disabilitata. Questa cosa è stata sistemata con <a href="/en-US/docs/Mozilla/Firefox/Releases/25/Site_Compatibility">Firefox 25</a>. ({{bug(884921)}}).</p>
</div>
<h3 id="Ottenere_la_posizione_corrente">Ottenere la posizione corrente</h3>
<p>Per ottenere la posizione corrente dell'utente devi chiamare il metodo {{domxref("geolocation.getCurrentPosition()","getCurrentPosition()")}}. Viene così lanciata una richiesta asincrona che calcola la posizione attuale dell'utente. Quando la posizione viene calcolata, la funzione viene eseguita. Puoi creare una funzione che viene chiamata in caso di errore. Un terzo parametro opzionale è un oggetto che permette di settare il tempo massimo della posizione calcolata, il tempo di attessa per una nuova richiesta e la possibilità di usare la massima accuratezza per il cacolo della posizione.</p>
<div class="note">
<p><strong>Nota:</strong> Per default, {{domxref("Geolocation.getCurrentPosition()","getCurrentPosition()")}} cerca di calcolare la posizione nel modo più veloce possibile avendo però una bassa accuratezza. Questo metodo è utile se ti serve una risposta veloce. Dispositivi con il GPS possono richiedere anche alcuni minuti per fare un calcolo preciso della posizione, quindi dei dati meno accurati (come l'indirizzo IP o il wifi) possono essere usati da {{domxref("Geolocation.getCurrentPosition()","getCurrentPosition()")}}.</p>
</div>
<pre class="brush: js">navigator.geolocation.getCurrentPosition(function(position) {
do_something(position.coords.latitude, position.coords.longitude);
});</pre>
<p>L'esempio qui sopra chiama la funzione <code>do_something()</code> quando la posizione viene calcolata.</p>
<h3 id="Controllare_la_posizione_attuale">Controllare la posizione attuale</h3>
<p>Se la posizione cambia (perché il dispositivo di sposta o perché viene calcolata una posizione più accurata), puoi settare una funzione che viene chiamata quando la posizione attuale si aggiorna. Basta usare la funzione {{domxref("Geolocation.watchPosition()","watchPosition()")}}, che ha gli stessi parametri di input di {{domxref("Geolocation.getCurrentPosition()","getCurrentPosition()")}}. Questa funzione viene chiamata più volte così da permettere al browser di sapere sempre la posizione del dispositivo. La funzione di errore è opzionale come lo era per {{domxref("Geolocation.getCurrentPosition()","getCurrentPosition()")}}.</p>
<div class="note">
<p><strong>Nota:</strong> Puoi usare {{domxref("Geolocation.watchPosition()","watchPosition()")}} senza una chiamata iniziale a {{domxref("Geolocation.getCurrentPosition()","getCurrentPosition()")}}</p>
</div>
<pre class="brush: js">var watchID = navigator.geolocation.watchPosition(function(position) {
do_something(position.coords.latitude, position.coords.longitude);
});</pre>
<p>Il metodo {{domxref("Geolocation.watchPosition()","watchPosition()")}} ritorna un ID numerico che può essere usato per identificare univocamente il controllo della posizione; puoi usare questo valore insieme al metodo {{domxref("Geolocation.clearWatch()","clearWatch()")}} per fermare il controllo della posizione.</p>
<pre class="brush: js">navigator.geolocation.clearWatch(watchID);
</pre>
<h3 id="Risposta_positiva">Risposta positiva</h3>
<p>Sia {{domxref("Geolocation.getCurrentPosition()","getCurrentPosition()")}} che {{domxref("Geolocation.watchPosition()","watchPosition()")}} accettano una risposta positiva, opzionalmente una risposta di errore e un oggetto <a href="/en-US/docs/Web/API/PositionOptions">PositionOptions</a>.</p>
<p>{{page("/en-US/docs/DOM/navigator.geolocation.getCurrentPosition","PositionOptions")}}</p>
<p>Una chiamata a {{domxref("Geolocation.watchPosition()","watchPosition")}} è più o meno così:</p>
<pre class="brush: js">function geo_success(position) {
do_something(position.coords.latitude, position.coords.longitude);
}
function geo_error() {
alert("Nessuna posizione disponibile.");
}
var geo_options = {
enableHighAccuracy: true,
maximumAge : 30000,
timeout : 27000
};
var wpid = navigator.geolocation.watchPosition(geo_success, geo_error, geo_options);</pre>
<h2 id="Descrivere_una_posizione">Descrivere una posizione</h2>
<p>La posizione dell'utente è descritta usando un oggetto <code>Position</code>, che deriva dall'oggetto <code>Coordinates</code>.</p>
<p>{{page("/en-US/docs/DOM/navigator/geolocation/getCurrentPosition","Position")}}</p>
<p>{{page("/en-US/docs/DOM/navigator/geolocation/getCurrentPosition","Coordinates")}}</p>
<h2 id="Errori">Errori</h2>
<p>La funzione che viene invocata in caso di errore quando si chiamano <code>getCurrentPosition()</code> o <code>watchPosition()</code> vuole un oggetto <a href="/en-US/docs/Web/API/PositionError">PositionError</a> come primo parametro.</p>
<pre class="brush: js">function errorCallback(error) {
alert('ERROR(' + error.code + '): ' + error.message);
};
</pre>
<p>{{page("/en-US/docs/DOM/navigator/geolocation/getCurrentPosition","PositionError")}}</p>
<h2 id="Esempi_live">Esempi live</h2>
<div class="hidden">
<pre class="brush: css">body {
padding: 20px;
background-color:#ffffc9
}
p { margin : 0; }
</pre>
</div>
<h3 id="HTML_Content">HTML Content</h3>
<pre class="brush: html;"><p><button onclick="geoFindMe()">Viasualizza la mia posizione</button></p>
<div id="out"></div>
</pre>
<h3 id="JavaScript_Content">JavaScript Content</h3>
<pre class="brush: js;">function geoFindMe() {
var output = document.getElementById("out");
if (!navigator.geolocation){
output.innerHTML = "<p>La geolocalizzazione non è supportata dal tuo browser</p>";
return;
}
function success(position) {
var latitude = position.coords.latitude;
var longitude = position.coords.longitude;
output.innerHTML = '<p>Latitudine: ' + latitude + '° <br>Longitudine: ' + longitude + '°</p>';
var img = new Image();
img.src = "https://maps.googleapis.com/maps/api/staticmap?center=" + latitude + "," + longitude + "&zoom=13&size=300x300&sensor=false";
output.appendChild(img);
}
function error() {
output.innerHTML = "Impossibile calcolare la tua posizione";
}
output.innerHTML = "<p>Locating…</p>";
navigator.geolocation.getCurrentPosition(success, error);
}
</pre>
<h3 id="Risultato_live">Risultato live</h3>
<p>{{EmbedLiveSample('Geolocation_Live_Example', 350, 410)}}</p>
<h2 id="I_permessi">I permessi</h2>
<p>Tutte le estensioni presenti su <a href="https://addons.mozilla.org/">addons.mozilla.org</a> che richiedono la posizione sono obbligate a chiedere un permesso all'utente. La seguente funzione richiede il permesso per l'uso della posizione. La risposta dell'utente viene salvata nelle preferenze tramite il parametro <code>pref</code>. La funzione fornita nel parametro <code>callback</code> viene chiamata con un valore booleano (<code>true</code> o <code>false</code>) che indica la risposta dell'utente. Se la risposta è <code>true</code>, l'estensione può accedere alla posizione dell'utente.</p>
<pre class="brush: js">function prompt(window, pref, message, callback) {
let branch = Components.classes["@mozilla.org/preferences-service;1"]
.getService(Components.interfaces.nsIPrefBranch);
if (branch.getPrefType(pref) === branch.PREF_STRING) {
switch (branch.getCharPref(pref)) {
case "always":
return callback(true);
case "never":
return callback(false);
}
}
let done = false;
function remember(value, result) {
return function() {
done = true;
branch.setCharPref(pref, value);
callback(result);
}
}
let self = window.PopupNotifications.show(
window.gBrowser.selectedBrowser,
"geolocation",
message,
"geo-notification-icon",
{
label: "Share Location",
accessKey: "S",
callback: function(notification) {
done = true;
callback(true);
}
}, [
{
label: "Always Share",
accessKey: "A",
callback: remember("always", true)
},
{
label: "Never Share",
accessKey: "N",
callback: remember("never", false)
}
], {
eventCallback: function(event) {
if (event === "dismissed") {
if (!done) callback(false);
done = true;
window.PopupNotifications.remove(self);
}
},
persistWhileVisible: true
});
}
prompt(window,
"extensions.foo-addon.allowGeolocation",
"Foo Add-on wants to know your location.",
function callback(allowed) { alert(allowed); });
</pre>
<h2 id="Compatibilità_dei_browser">Compatibilità dei browser</h2>
<div>{{CompatibilityTable}}</div>
<div id="compat-desktop">
<table class="compat-table">
<tbody>
<tr>
<th>Funzionalità</th>
<th>Chrome</th>
<th>Edge</th>
<th>Firefox (Gecko)</th>
<th>Internet Explorer</th>
<th>Opera</th>
<th>Safari</th>
</tr>
<tr>
<td>Supporto base</td>
<td>{{CompatChrome(5.0)}}</td>
<td>{{CompatVersionUnknown}}</td>
<td>{{CompatGeckoDesktop("1.9.1")}}<sup>[1]</sup></td>
<td>9</td>
<td>10.60<br>
{{CompatNo}} 15.0<br>
16.0</td>
<td>5</td>
</tr>
<tr>
<td>Secure origins only</td>
<td>{{CompatChrome(50.0)}}</td>
<td>{{CompatNo}}</td>
<td>{{CompatGeckoDesktop("55")}}</td>
<td>{{CompatNo}}</td>
<td>39</td>
<td>10</td>
</tr>
</tbody>
</table>
</div>
<div id="compat-mobile">
<table class="compat-table">
<tbody>
<tr>
<th>Funzionalità</th>
<th>Android</th>
<th>Android Webview</th>
<th>Edge</th>
<th>Firefox Mobile (Gecko)</th>
<th>Firefox OS</th>
<th>IE Mobile</th>
<th>Opera Mobile</th>
<th>Safari Mobile</th>
<th>Chrome for Android</th>
</tr>
<tr>
<td>Supporto base</td>
<td>{{CompatUnknown}}</td>
<td>{{CompatVersionUnknown}}</td>
<td>{{CompatVersionUnknown}}</td>
<td>{{CompatGeckoMobile("4")}}</td>
<td>1.0.1</td>
<td>{{CompatUnknown}}</td>
<td>10.60<br>
{{CompatNo}} 15.0<br>
16.0</td>
<td>3.2</td>
<td>{{CompatVersionUnknown}}</td>
</tr>
<tr>
<td>Secure origins only</td>
<td>{{CompatUnknown}}</td>
<td>{{CompatChrome(50.0)}}</td>
<td>{{CompatNo}}</td>
<td>{{CompatGeckoMobile("55")}}</td>
<td> </td>
<td> </td>
<td> </td>
<td>10.1</td>
<td>{{CompatChrome(50.0)}}</td>
</tr>
</tbody>
</table>
</div>
<p>[1] Firefox calcola la tua posizione anche usando il tuo WiFi grazie ai Google Location Services. Durante il trasferimento tra Firefox e Google, i dati scambiati includono dei dati sul WiFi Access Point, un token di accesso (simile a un cookie) e l'indirizzo IP dell'utente. Per maggiori informazioni, dai un'occhiata alla <a href="http://www.mozilla.com/en-US/legal/privacy/">Privacy Policy</a> di Mozzilla e alla <a href="http://www.google.com/privacy-lsf.html">Privacy Policy</a> di Google.</p>
<p>[2] A causa del punto [1], questa API non si può usare in China. Puoi usare le API di Baidu o di Autonavi.</p>
<p>Firefox 3.6 (Gecko 1.9.2) ha aggiunta il supporto per l'uso del servizio <a href="http://catb.org/gpsd/">GPSD</a> (GPS daemon) per usare la geolocalizzazione su Linux.</p>
<h2 id="Vedi_anche">Vedi anche</h2>
<ul>
<li>{{domxref("navigator.geolocation")}}</li>
<li><a href="/en-US/Apps/Build/gather_and_modify_data/Plotting_yourself_on_the_map">Plotting yourself on the map</a></li>
<li><a href="https://www.w3.org/TR/geolocation-API/" rel="external">Geolocation API on w3.org</a></li>
<li><a href="https://hacks.mozilla.org/2013/10/who-moved-my-geolocation/">Who moved my geolocation?</a> (Hacks blog)</li>
</ul>
|