Geolocation - JavaScript

Find brugerens geografiske position med JavaScript geolocation API som så kan bruges til at vise hvor brugeren cirka er på et kort

Introduktion

Geolocation går ud på at hjemmesiden får at vide hvor brugerens computer befinder sig med information som breddegrad, længdegrad og præcision.

Dataene kan bruges til for eksempel at vise hvor brugeren er på et kort.

Browsertest

Browserunderstøttelse af geolocation

Browser Geolocation
Firefox logo
Firefox 19.0.2
ja
Opera logo
Opera 12.14
ja
Safari logo
Safari 5.1.7
ja1
Chrome logo
Chrome 25.0.1364.172 m
ja
Internet Explorer logo
Internet Explorer 10.0.9200.16521
ja
Alle tests er udført på Windows 7 (64-bit)


1 Virker hvis man bruge WiFi (trådløs forbindelse). Virker ikke hvis man bruger kabel da vil browseren bliver ved med at forsøger at hente positionen uden at det lykkes hvis der ikke er angivet en timeout. Hvis der er angivet en timeout vil det give en timeout når tiden er udløben uden at positionen findes.
Browserunderstøttelse fra caniuse.com :

Screenshots

Når man besøger en hjemmeside som bruger geolocation skal brugeren give tilladelse til at hjemmesiden må kende brugerens position.
Har man tidligere givet tilladelse eller afvist geolocation er det ikke sikkert man bliver spurgt igen.

Følgende besked dukker op i browseren når JavaScript getCurrentPosition() eller watchPosition() kaldes.

Firefox.
geolocation Nightly
Opera.
geolocation Opera
Safari.
geolocation Safari
Chrome.
geolocation Chrome
Internet Explorer.
geolocation Internet Explorer

navigator.geolocation

Geolocation bruges med JavaScript navigator.geolocation.

navigator.geolocation returner NULL hvis browseren ikke understøtter geolocation.

Med følgende kode kan man teste om browseren understøtter geolocation og kun forsøge at hente positionen hvis browseren understøtter det.

navigator.geolocation.getCurrentPosition

getCurrentPosition() tager 1, 2 eller 3 parameter.

Parameter 1 kan være navnet på en funktion som kaldes hvis positionen blev fundet.
Parameter 2 kan være navnet på en funktion som kaldes hvis der skete en fejl, hvis brugeren afslog at dele sin position eller positionen på anden måde ikke kunne hentes.
Parameter 3 bruges til at sætte én eller flere indstillinger.

Parameter 2 og 3 er valgfri.

Her ses et eksempel hvor der bruges 2 parameter.


Her ses hvordan man kan bruge den 3. parameter til at sætte én eller flere indstillinger.

enableHighAccuracy : [true | false]

Hvis sat til true fortæller man at man ønsker den størst mulige præcision.
Dette kan give langsommere resultat og øge strømforbruget hvilket kan være uønsket på mobile enheder som bruger batteri.
Det er heller ikke altid det virker.
Jeg vil tro det at det betyder at positionen hentes med GPS, men det er så ikke alle enheder som har GPS.

timeout : [millisekunder | Infinity]

Hvor længe der må gå før timeout (fejlkode 3).
1000 = 1 sekund.

maximumAge : [millisekunder | Infinity]

Tillader en cache position der ikke er ældre end x antal millisekunder.
Hvis sættes til "Infinity" så hentes cache positionen ligegyldigt hvor gammel.
1000 = 1 sekund.

coords

code og message

navigator.geolocation.watchPosition

navigator.geolocation.getCurrentPosition() og navigator.geolocation.watchPosition() bruger samme parameter.

getCurrentPosition() henter positionen én gang.

watchPosition() henter positionen igen og igen med et interval man selv bestemmer så kan man følge enheden når den flytter sig og man kan løbende hente en mere præcis position når forskellige teknikker bruges (GSM/CDMA, IP, GPS, osv).

watchPosition() returner et watchID som senere kan bruges til at stoppe positions-hentningen med clearWatch().



Jeg har indtil videre ikke kunne få navigator.geolocation.watchPosition() til at virke.
Jeg syntes bare jeg får en timeout nummer 2 gang positionen skal hentes.
Jeg ved ikke om det er fordi der ikke er nogen browsere der understøtter det endnu eller om det er fordi jeg ikke har testet det når jeg er i bevægelse så positionen ændre sig.
Når man tester fra en ikke-mobil internetforbindelse så ændre positionen sig jo ikke.

address

Geolocation skulle også kunne give menneske-forståelige-information som land, vejnavn, postnummer ved at bruge address.

Jeg har dog ikke så meget info om dette endnu da address returner undefined i alle de browsere jeg har prøvet.

Det skulle have virket i Firefox op til version 14.0 hvor efter address blev fjernet.

address lader til at være en del af Geolocation API Specification Level 2.

Præcision

coords.accuracy giver en ide om hvor præcis positionen er.

Der findes flere måder at finde positionen.

De forskellige måder har forskellig præcision.

Erfaring

Jeg har oplevet at positionen er 50 km ved siden af, et par km ved siden af og cirka 20 meter fra hvor jeg var.
Jeg har også oplever at positionen var forkert da jeg ikke var inden for accuracy området.

GPS satellitter

Mest præcis.
Kræver en GPS modtager.

GSM/CDMA mobiltelefon master celle ID

Middel præcision.
Positionen kan findes med 1 telefonmast (lidt præcis) eller med flere telefonmaster (mere præcis).

IP adresser

Mest upræcis.
Det kan sikkert godt være præcist men der er nok stor chance for at det er meget upræcist.

Andet

RFID
WiFi
Bluetooth MAC adresser

Positionsudbydere

Positionsudbyder kan kaldes "Network location provider" på engelsk.

For eksempel Bing og Google.

Man kan opnår forskellig position alt efter hvad browser man bruger.
Det må være fordi browserne bruger forskellige positionsudbydere.

Umiddelbart lader det til at Firefox, Opera og Chrome bruger Google.
Internet Explorer bruger nok Bing.
Safari bruger nok en anden service da den afviger fra de andres.

Læs eventuelt https://www.mozilla.org/da/firefox/geolocation/.

Do not track

"Do not track" går ud på at brugeren i sin browser kan vælge en indstilling der for eksempel hedder "Ask websites not to track me".

Når brugeren har valgt denne indstilling så sendes der en ekstra linje i HTTP headeren om at brugeren ikke ønsker at blive sporet.
Den information kan en hjemmeside så bruge til at undlade at spore brugeren. Men det er helt op til hjemmesiden om den ønsker at følge brugerens ønske om ikke at blive sporet.

Browserunderstøttelse af "Do not track".
Browser Navigator.doNotTrack
understøttelse
Standard værdi for navigator.doNotTrack Navigator.doNotTrack
bruger har valgt ikke at ville spores
Navigator.doNotTrack
bruger har valgt gerne at ville spores
Firefox logo
Firefox 21.0
ja unspecified yes yes
Opera logo
Opera 12.02
ja null 1
Safari logo
Safari 5.1.7
ja undefined 1
Chrome logo
Chrome 21.0.1180.83 m
nej
Internet Explorer logo
Internet Explorer 10.0.9200.16438 Pre-Release
ja1
navigator.msDoNotTrack
1
Alle tests er udført på Windows 7 (64-bit)


1 Kan muligvis slås til i Tilføjelsesprogrammer - Tracking protection - Get a Tracking Protection List online... IE10 har som standard slået Do Not Track til hvilket har givet noget ballade fordi det ifølge specifikationerne skal være et valg som brugeren gør. Derfor er der noget ballade med at Apache som i version 2.4 har følgende kode i httpd.conf filen (som dog er udkommenteret som standard).



At sætte "do not track" indstillingen i browseren

Firefox 21.0 : Funktioner→Indstillinger→Privatliv→Sporing→Fortæl websteder, at jeg ikke vil spores.

Opera 12.02 : Funktioner→Indstillinger...→Avanceret→Sikkerhed→Bed websteder om ikke at spore mig

Safari 5.1.7 : Indstillinger...→Avanceret→Sikkerhed→Vis Udviklermenuen på menulinjen også Udvikler→Send HTTP-headeren Do Not Track

Internet Explorer 10.0.9200.16438 Pre-Release : Tools→Tracking Protection...→Tracking Protection ... noget i den stil. Set ikke ud til at være en indstilling.


I Firefox 21.0 er der 3 valgmuligheder for "do not track".
Valgmuligheder får navigator.doNotTrack til at returner henholdsvis "yes", "yes" og "unspecified".
Ja "yes" returnes både når man vælger man ikke vil spores og man gerne vil spores. Mon ikke det er en fejl.
Firefox 21.0 privatliv sporing
Fra Firefox 32 returneres '1' eller '0', i stedet for 'yes' eller 'no'.

Når brugeren har valgt ikke at ville spores kan en af følgende linjer sendes i HTTP headeren.


Værdien af navigator.doNotTrack er "undefined" hvis browseren ikke understøtte det. (Dog siger Safari 5.1.7 "undefined" selvom den godt kan sættes).

Ellers returner navigator.doNotTrack en værdi som "unspecified", "yes", "null" eller "1" afhængig af browseren og den indstilling brugeren har valgt i browseren.
Resultatet ovenfor er skabt af følgende kode

Skriv din kommentar

Spørg mig om hvad som helst
Du kan også skrive direkte til mig på
Stem
Søg
Language

Select English to navigate the website in English. Things like the navigation menu and contact form will be in English, but the main content on each page will not be translated.