HTML5 Geolocation

HTML5 Geolocation是用来获取用户设备或者浏览器的地理位置信息的Web API。通过该API，您可以轻松地获取到用户所在的地理位置信息，包括用户所在的经度、纬度、高度、速度等相关信息。这样您就可以设计出现在许多应用和服务中的地理位置相关产品。

使用HTML5 Geolocation

使用HTML5 Geolocation很简单，只需在前端页面中调用该API即可。以下是一个简单的使用HTML5 Geolocation获取地理位置的例子：

if (navigator.geolocation) {
  navigator.geolocation.getCurrentPosition(function(position) {
    console.log("当前位置的经度: " + position.coords.longitude + " 纬度: " + position.coords.latitude);
  });
} else {
  console.log("地理位置信息不可用。");
}

在上述代码中，首先通过if (navigator.geolocation)语句判断当前设备是否支持该API。如果支持：调用 navigator.geolocation.getCurrentPosition 方法，并传入一个回调方法。在该回调方法中，获取到用户当前的位置信息，并将其打印到控制台中；如果不支持：向控制台输出“地理位置信息不可用。”。

Geolocation API方法

HTML5 Geolocation主要提供了以下三个方法：

getCurrentPosition() 方法

通过调用navigator.geolocation.getCurrentPosition()方法，获取到当前的设备位置信息。该方法的第一个参数是一个成功回调函数，用来获取到设备位置信息。如果设备位置信息获取失败，则调用该函数的第二个参数，该参数是一个函数，用来处理地理位置请求异常或超时的情况，一般情况下该函数可选。例如：

navigator.geolocation.getCurrentPosition(successCallback, errorCallback);

watchPosition() 方法

通过调用navigator.geolocation.watchPosition()方法，监听设备位置变化。当设备位置信息发生变化时，会触发该方法的参数中所传入的函数。该方法会返回一个唯一标识符，用来注销该监听函数。例如：

var watchId = navigator.geolocation.watchPosition(successCallback, errorCallback, options);

clearWatch() 方法

通过调用navigator.geolocation.clearWatch()方法，注销之前所注册的事件。该方法会接收第一个参数，即watchId，用来指定注销哪个事件。例如：

navigator.geolocation.clearWatch(watchId);

可选参数

Geolocation API还提供了以下的可选参数：

enableHighAccuracy

可选的enableHighAccuracy参数是一个Boolean类型的值，标识着是否需要更精确的地理位置信息。如果设置enableHighAccuracy为true，则系统会采用更加精确的定位方式，否则会采用更广泛的定位方式。不过请注意：精确的定位方式对电池及网络的消耗会更大一些。

var options = {
  enableHighAccuracy: true
}

timeout

可选的timeout参数用来设置地理位置信息请求的超时时间，如果请求的时间超过该时间，则会视为请求超时而抛出异常。单位为毫秒。值为0时表示不设置超时时间。例如：

var options = {
  timeout: 5000
}

maximumAge

可选的maximumAge参数用来设置地理位置信息的有效期，建议尽量缓存已经获取的地理位置信息。该参数表示在多少毫秒内如果再次请求该接口，返回的是本地保存的地理位置信息，而不是实时的地理位置信息。例如：

var options = {
  maximumAge: 60000
}

总结

通过使用HTML5 Geolocation，您可以获得用户的经纬度信息，这是现代Web应用中极为重要的功能，例如我们的地图、天气预报、位置基础应用等等。不能忽视的是，Geolocation API调用时需要请求浏览器联网，如果用户禁止了联网应用可能工作不正常。感谢HTML5 Geolocation的存在，让我们可以在Web应用中实现更加复杂的功能。