You are here: Home ‣ Dive Into HTML5 ‣
YOU ARE HERE
(AND SO IS EVERYBODY ELSE)
Show table of contents
DIVING IN
Eolocation is the art of figuring out where you are in the world and (optionally) sharing that information with people you trust. There is more than one way to figure out where you are – your IP address, your wireless network connection, which cell tower your phone is talking to, or dedicated GPS hardware that calculates latitude and longitude from information sent by satellites in the sky.
ASK PROFESSOR MARKUP
☞Q: Geolocation sounds scary. Can I turn it off?
A: Privacy is an obvious concern when you’re talking about sharing your physical location with a remote web server. The geolocation API explicitly states: “User Agents must not send location information to Web sites without the express permission of the user.” In other words, sharing your location is always opt-in. If you don’t want to, you don’t have to.
THE GEOLOCATION API
The geolocation API lets you share your location with trusted web sites. The latitude and longitude are available to JavaScript on the page, which in turn can send it back to the remote web server and do fancy location-aware things like finding local businesses or showing your location on a map.
As you can see from the following table, the geolocation API is supported by most browsers on the desktop and mobile devices. Additionally, some older browsers and devices can be supported by wrapper libraries, as we’ll see later in this chapter.
GEOLOCATION API SUPPORT
IE FIREFOX SAFARI CHROME OPERA IPHONE ANDROID
9.0+ 3.5+ 5.0+ 5.0+ 10.6+ 3.0+ 2.0+
Along with support for the standard geolocation API, there are a plethora of device-specific APIs on other mobile platforms. I’ll cover all that later in this chapter.
SHOW ME THE CODE
The geolocation API centers around a new property
on the global navigator object: navigator. geolocation.
The simplest use of the geolocation API looks like this:
Function get_location() {
navigator. geolocation. getCurrentPosition(show_map);
}
That has no detection, no error handling, and no options. Your web application should probably include at least the first two of those. To detect support for the geolocation API, you can use Modernizr:
Function get_location() {
if (Modernizr. geolocation) {
navigator. geolocation. getCurrentPosition(show_map);
} else {
// no native support; maybe try Gears?
}
}
⇜ I CAN HAS GEO?
What you do without geolocation support is up to you. I’ll explain the Gears fallback option in a minute, but first I want to talk about what happens during that call to getCurrentPosition(). As I mentioned at the beginning of this chapter, geolocation support is opt-in. That means your browser will never force you to reveal your current physical location to a remote server. The user experience differs from browser to browser. In Mozilla Firefox, calling the getCurrentPosition() function of the geolocation API will cause the browser to pop up an “infobar” at the top of the browser window. The infobar looks like this:
There’s a lot going on here. You, as the end user,
Are told that a website wants to know your location
Are told which website wants to know your location
Can click through to Mozilla’s “Location-Aware Browsing” help page which explains what the heck is going on (short story: Google provides the location and stores your data in accordance with its Location Service Privacy Policy)
(No Ratings Yet)