How does web browser geolocation work? [closed]

Question

I would like to know how geolocation works in a web browser like Google Chrome or Firefox?

I can access this web site http://html5demos.com/geo and when I allow the browser to send my location, it shows my current location.

But when I send that URL to my friends to test it, it doesn't work for all of them. How does geolocation work and how do I implement it to get the correct location?

Answer 1

When you visit a location-aware website, Firefox will ask you if you want to share your location.

If you consent, Firefox gathers information about nearby wireless access points and your computer’s IP address. Then Firefox sends this information to the default geolocation service provider, Google Location Services, to get an estimate of your location. That location estimate is then shared with the requesting website.

http://www.mozilla.com/en-US/firefox/geolocation/

So it depends on the browser they are using and some luck :-)

Answer 2

Re how it works: the Wikipedia article discusses several techniques (IP address location, cellphone and WiFi triangulation, GPS).

The HTML5 implementations require both browser support (FF 3.6, Opera 10.60, Chrome 4? 5?, IE maybe some day) and user consent before the geolocation data are retrieved.

As to how to implement it, the code of the demo you link to seems to be under the MIT License which basically says "you can do whatever, as long as you keep the resulting code under the license"; so you could take that code as a base to build on.

Answer 3

Info and examples from W3C Geolocation API Specification:

The Geolocation API defines a high-level interface to location information associated only with the device hosting the implementation, such as latitude and longitude. The API itself is agnostic of the underlying location information sources. Common sources of location information include Global Positioning System (GPS) and location inferred from network signals such as IP address, RFID, WiFi and Bluetooth MAC addresses, and GSM/CDMA cell IDs, as well as user input. No guarantee is given that the API returns the device's actual location.

You could implement it this way:

(one-shot position request)

function showMap(position) {
  // Show a map centered at (position.coords.latitude, position.coords.longitude).
}

// One-shot position request.
navigator.geolocation.getCurrentPosition(showMap);

(requesting repeated position updates)

function scrollMap(position) {
  // Scrolls the map so that it is centered at (position.coords.latitude, position.coords.longitude).
}

// Request repeated updates.
var watchId = navigator.geolocation.watchPosition(scrollMap);

function buttonClickHandler() {
  // Cancel the updates when the user clicks a button.
  navigator.geolocation.clearWatch(watchId);
}