浏览器公开了一个navigator.geolocation 对象，我们将通过它进行所有的地理位置操作。
为了安全起见，它只在使用HTTPS的页面上可用，而且在所有现代浏览器上都可用。
由于
window是全局对象，我们可以访问navigator，而不必指定window.navigator
浏览器暴露的window.navigator 属性指向一个Navigator对象，该对象是一个容器对象，为我们提供了很多网络平台的API。
geolocation 对象提供了以下方法。
getCurrentPosition()watchPosition()clearWatch()
第一个是用来获取当前的位置坐标。当我们第一次调用这个方法时，浏览器会自动询问用户是否允许与我们分享这些信息。
这是这个界面在Chrome中的样子。
在Firefox上
和Safari上的界面。
这只需要在每个原点做一次。你可以改变你所做的决定，并恢复一个许可决定。这是你在Chrome浏览器中的操作方式，点击域名附近的锁图标。
一旦这个权限被授予，我们就可以继续。
获取用户的位置
让我们从这个示例代码开始。
navigator.geolocation.getCurrentPosition(() => {})
权限面板应该出现。允许该权限。
注意我是如何传递一个空的箭头函数的，因为这个函数要一个回调函数。
这个函数被传递给一个Position 对象，其中包含实际的位置。
navigator.geolocation.getCurrentPosition(position => {
console.log(position)
})
这个对象有2个属性。
coords, 一个Coordinates对象timestamp, 检索位置时的UNIX时间戳
Coordinates 对象带有几个定义位置的属性。
accuracy测量的位置精度，用米表示altitude测量的海拔高度值altitudeAccuracy测量的海拔高度的准确性，以米表示heading设备行驶的方向。用度数表示（0=北，东=90，南=180，西=270）。latitude测量的纬度值longitude测量的经度值speed设备行驶的速度，以米/秒表示
根据实现方式和设备的不同，其中一些将被null 。例如，在我的MacBook Air上运行的Chrome浏览器上，我只得到了accuracy 、latitude 和longitude 的值。
navigator.geolocation.getCurrentPosition(position => {
console.log(position.coords.latitude)
console.log(position.coords.longitude)
})
观察位置的变化
除了使用getCurrentPosition() 来获取一次用户位置之外，你还可以使用navigator.geolocation 的watchPosition() 方法来注册一个回调函数，该函数将在设备向我们传达的每一个变化时被调用。
使用方法。
navigator.geolocation.watchPosition(position => {
console.log(position)
})
当然，浏览器也会用这个方法询问权限，如果它还没有被授予的话。
我们可以通过调用navigator.geolocation.clearWatch() 方法，将watchPosition() 返回的id 传递给它，从而停止观察一个位置。
const id = navigator.geolocation.watchPosition(position => {
console.log(position)
})
//stop watching after 10 seconds
setTimeout(() => {
navigator.geolocation.clearWatch(id)
}, 10 * 1000)
如果用户拒绝了该权限
还记得当我们调用其中一个方法来获取位置时，浏览器显示的权限弹出窗口吗？
如果用户否认，我们可以通过添加一个错误处理函数来拦截这种情况，作为方法getCurrentPosition() 和watchPosition() 的第二个参数。
navigator.geolocation.getCurrentPosition(position => {
console.log(position)
}, error => {
console.error(error)
})
传给第二个参数的对象包含一个code 属性，以区分错误类型。
1表示权限被拒绝2意味着位置不可用3意味着超时
添加更多的选项
当我之前谈及错误时，我提到了超时错误。查询位置可能需要一些时间，我们可以设置一个允许执行该操作的最长时间，作为一个选项。
你可以通过给getCurrentPosition() 和watchPosition() 方法添加第三个参数来添加超时，一个对象。
navigator.geolocation.getCurrentPosition(position => {
console.log(position)
}, error => {
console.error(error)
}, {
})
在这个对象中，我们可以通过以下属性
timeout设置请求出错前的毫秒数maximumAge设置浏览器缓存位置的最大 "年龄"。我们不接受超过设定的毫秒数的位置enableHighAccuracy一个布尔值，默认为 ，需要一个尽可能高的精度水平的位置（这可能需要更多的时间和更多的能量）。false
使用实例：
navigator.geolocation.getCurrentPosition(position => {
console.log(position)
}, error => {
console.error(error)
}, {
timeout: 1000,
maximumAge: 10000,
enableHighAccuracy: true
})
