Standortbestimmung per Javascript

Über die Geolocation API, das Google Gears und z.B. Firefox ab 3.5 unterstützt, lassen sich einfach ortsbezogene Dienste im Browser realisieren.

Location based, also standortbezogenes, Browsing ist eins der neuen Konzepte für das Web. Und es nicht mehr nur auf mobile Applikationen beschränkt. Den Standort zu wissen, bedeutet einfach mehr Service und Dienste für den Benutzer. Zum Beispiel können Bewertungsportale für Restaurants automatisch gleich passende Treffer in der Nähe anzeigen, ohne das man seine Adresse per Hand eingebe muss.

In diesem Artikel geht es darum wie man die Geolocation mit Hilfe von Javascript ausliest. Aber natürlich fragt man sich zu Recht, ob die Umsetzung überhaupt Sinn macht, wenn es aktuell nur von Firefox ab Version 3.5 unterstützt wird. Aber zum einen gibt es einen eigenen Working Draft der Geolocation API von der W3C. So das es mit ziemlicher Sicherheit in naher Zukunft von allen anderen großen Browsern auch unterstützt wird.
Außerdem kann Geolocation mit allen Browsern genutzt werden in den Google Gears installiert ist. Gears ist verfügbar für Windows, Windows Mobile (IE Mobile, Opera Mobile), Mac OS X (Firefox, Safari), Linux und Android. Darüber hinaus funktioniert es auch mit Firefox 3.0 wenn das Geode Plugin installiert ist.

Als erstes aber nur zu Geolocation auf Firefox 3.5. Die Geolocation API befindet sich in einem geolocation Kindobjekt innerhalb des navigator Objektes. Und darauf bezogen können wir nun testen ob eine Geolocation-Unterstützung vorhanden ist, indem wir folgenden Code benutzen:

if (navigator.geolocation) {
   /* Geolocation ist verfuegbar */
 else {
    alert("Der Browser unterstuetzt keinen Geolocation Dienst.");
}

Dieses Verfahren ist einem einfachen Browsercheck vorzuziehen, um auch für zukünftige Entwicklungen gerüstet zu sein.

Aktuelles Standort im Firefox abfragen

Um den Standort des Benutzers zu bekommen, ruft man die getCurrentPosition() Methode auf. Diese startet eine asynchronen Abfrage auf die aktuelle Position. Wenn diese bestimmt wurde, ruft es damit den Callback mit dem Ergebnis auf:

navigator.geolocation.getCurrentPosition(function(position) {
  do_something(position.coords.latitude, position.coords.longitude);
});

Und mit dieser Information können wir nun einfach weiter in unserer Anwendung arbeiten:

function getLocation(){
	navigator.geolocation.getCurrentPosition(gotLocation, noLocation);
}
function gotLocation(position){
	var lat = position.coords.latitude;
	var long = position.coords.longitude;
	alert('Der Standort lautet ' + lat + ', ' + long);
}
function noLocation(){
	alert('Standortbestimmung nicht erfolgreich.');
}
getLocation();

Mit Google Gears den Standort bestimmen

Und nun die selbe Prozedur mit Hilfe von Google Gears. Also nicht vergessen Gears zu installieren und eine passende gears_init Datei einfügen.

<script type="text/javascript" src="http://code.google.com/apis/gears/gears_init.js"></script>
<script type="text/javascript">
function getLocation(){
	var location = google.gears.factory.create('beta.geolocation');
	location.getCurrentPosition(gotLocation, noLocation);
}
function gotLocation(position){
	var lat = position.latitude;
	var long = position.longitude;
	alert('Der Standort lautet ' + lat + ', ' + long);
}
function noLocation(){
	alert('Standortbestimmung nicht erfolgreich.');
}
getLocation();
</script>

Wie man sieht, gibt es nicht viele Unterschiede zwischen den beiden Methoden. Durch die gears_ini Datei bekommen wir Funktionen um mit der Gears-Engine auf dem Benutzerrechner zu kommunizieren. Danach initialisiert man Gears und erstellt eine neue Variable, welche mit den Gears-Funktionen benutzt wird. Danach muss man nur noch getCurrentPosition aufrufen und der Rest ist wieder der selbe.

Beide Wegen zusammenführen

Durch diese starke Ähnlichkeit lassen sich beide Codes auch einfach in einen Aufruf kombinieren. Und damit funktioniert es dann bequem mit beiden Technologien:

<script type="text/javascript" src="http://code.google.com/apis/gears/gears_init.js"></script>
<script type="text/javascript">
function getLocation(){
	var location = null;
	if (navigator.geolocation){
		location = navigator.geolocation;
		var geoAPI = 1;
	}else{
		location = google.gears.factory.create('beta.geolocation');
		var geoAPI = 0;
	}
	if(location){
		location.getCurrentPosition(gotLocation, noLocation);
	}else{
		alert("Der Browser unterstuetzt keinen Geolocation Dienst.");
	}
}
function gotLocation(position){
	if (geoAPI == 1){
		var lat = position.coords.latitude;
		var long = position.coords.longitude;
	}else{
		var lat = position.latitude;
		var long = position.longitude;
	}
	alert('Der Standort lautet ' + lat + ', ' + long);
}
function noLocation(){
	alert('Standortbestimmung nicht erfolgreich.');
}
getLocation();
</script>