应用程序编程接口 是编程指令集合和访问软件应用程序的标准。通过一个 API,您可以利用 API 提供的服务设计出强大的产品。

HTML5 提供了一些新的 API。例如:

  • 用于渲染图形或其他可视图像的新 canvas 元素所使用的 2D 绘图 API
  • 支持离线 Web 应用程序的缓存 API
  • 使用新 video 和 audio 元素来播放视频和音频的 API
  • 支持浏览历史访问和添加页面的历史 API
  • draggable 属性支持的拖放 API
  • contenteditable 属性支持的编辑 API
  • 使用 JavaScript API 进行键-值对存储的客户端存储及嵌入式 SQL 数据库

本文主要关注于两个 API:Geolocation 和 Web Worker。首先,本文将分析 API;然后,再创建一个使用这两种 API 的页面。

回页首

商机无处不在:GEOLOCATION

您可以使用 Geolocation API 来确定和分享地理位置。这个 API 会返回经度和纬度坐标 — 企业可以利用这些信息向这个坐标附近的区域提供服务。这些服务一般指的是基于位置的服务(LBS)。

LBS 指的是用于确定所监控设备的物理位置的地理数据源,因此也可以确定该位置的人们。这个功能最有趣的地方是它使人们能够围绕某些关注的地理位置点周围的市场进行交互。

企业实际上是为客户创造优质、实用的服务和价值,同时为利益干系人、债权人、股东、员工和供应商创造经济和财务效益。由 Geolocation 支持的 LBS 能够使用非浏览器设备或浏览器来简化对货物或人的追踪和监控。在商业应用上,地理位置指的是利用地理信息来确定人或事的位置,然后将这些信息销售给任何需要使用这些信息的人, 他们可能利用这个位置信息来进行社交活动、商业应用或其他用途,前提是这些信息的拥有者已经授权使用这些信息。

如何获取地理信息

Geolocation API 是基于新增加的全局对象 navigatornavigator.geolocation。JavaScript 对象 navigator 包含了很有用的有关访问者的浏览器和系统的信息。Geolocation 可以使用 IP 地址、基于 Web 的数据库、无线网络连接和三角测量或 GPS 技术来确定经度和纬度。一定要注意 Geolocation 所提供信息的精确性会由于获取信息的方式不同而有所差别。有时候,您可能无法精确地读取某些位置的地理信息,甚至完全无法读取。

脚本可以使用 navigator.geolocation 对象来确定用户所使用设备的位置信息。在获得了位置信息之后,脚本会基于所获得的数据创建和生成一个位置对象。

navigator.geolocation 对象具有 3 个方法:

  • getCurrentPosition()
  • watchPosition()
  • clearWatch()

getCurrentPosition() 方法

getCurrentPosition() 方法能够获取用户的当前位置,但是只能获取一次。当脚本调用这个方法时,这个方法会以异步方式获取宿主设备的当前位置。异步通信 表示发送者和接收者在通信时并不是同时加入的。使用异步的通信方式使浏览器能够继续执行其他活动,这样它就不需要等待接收实体的响应。

getCurrentPosition() 方法最多可以接收 3 个参数:

  • geolocationSuccess 当前位置的回调函数(必需的)
  • geolocationError 出现错误时执行的回调函数(可选的)
  • geolocationOptions 地理位置选项(可选的)

navigator.geolocation.getCurrentPositon() 方法会将宿主设备的当前位置通过一个 Position 对象以参数的形式返回给回调函数 geolocationSuccess。如果出现错误,那么它会使用一个 PositionError 对象来调用回调函数 geolocationError。您可以为 geolocationOptions 设置 3 个属性:enableHighAccuracytimeout  maximumAge。如果设备支持,分别指定位置返回的超时时间和缓存位置可以使用的最长时间,那么这些可选属性就能够提高精确度。

getCurrentPosition() 方法的调用方式如下所示:

void navigator.geolocation.getCurrentPosition(
          geolocationSuccess, geolocationError, geolocationOptions);

watchPosition() 方法

watchPosition() 方法会定期查询用户的位置,观察用户位置是否发生了变化。它最多可以接收 3 个参数。

当调用 watchPosition 时,它会异步地启动一个观察进程,包括获取一个新的 Position 对象和创建一个 watchID。如果获取位置成功,那么关联了 Position 对象的geolocationSuccess 方法就被调用。如果执行带有非空的 geolocationError 参数的方法出现错误,那么这个方法会产生一个以 PositionError 对象为参数的 geolocationError。当设备的位置发生变化时,带有新的 Position 对象的回调函数就会被调用。

watchPosition() 方法的调用方式如下所示:

long navigator.geolocation.watchPosition(
          geolocationSuccess, geolocationError, geolocationOptions);

clearWatch() 方法

clearWatch() 方法会终止一个仍在执行的 watchPosition()。这个方法只能有一个参数。被调用时,它会查找之前声明的 watchID 参数,并立即停止它。

clearWatch() 方法的调用方式如下所示:

void navigator.geolocation.clearWatch(watchID)

地理数据:Position 对象

Geolocation API 会返回一个地理位置对象 Position。这个对象具有两个属性:timestamp  coordstimestamp 属性表示地理数据创建的时间。而 coords 属性包含了 7 个属性:

  • coords.latitude 估算的纬度
  • coords.longitude 估算的经度
  • coords.altitude 估算的高度
  • coords.accuracy 所得经度和纬度的估算精度,以米为单位
  • coords.altitudeAccuracy 所得高度的估算精度,以米为单位
  • coords.heading. 宿主设备的当前移动方向,以度为单位,相对于正北方向顺时针方向计算
  • coords.speed. 设备的当前对地速度,以米/秒为单位

这里只有 3 个属性是必需的:coords.latitudecoords.longitude  coords.accuracy。其他属性返回 null,取决于设备及其交互的后端定位服务器的功能。heading  speed 属性是基于用户的前一个位置计算的(如果有)。

稳定

产品高可用性高并发

贴心

项目群及时沟通

专业

产品经理1v1支持

快速

MVP模式小步快跑

承诺

我们选择声誉

坚持

10年专注高端品质开发
  • 返回顶部