《七》HTML5 地理定位 Geolocation

HTML5 Geolocation 地理定位用于获取用户的地理位置。由于该特性可能侵犯用户的隐私，所以除非用户同意，否则用户位置信息是不可用的。

想要获取用户的位置信息，先需要电脑或手机允许浏览器定位，然后需要浏览器允许网站定位，才能成功。

判断浏览器是否支持：

通过 window.navigator 对象下新增的 geolocation 属性来判断浏览器的兼容性。

if (windwo.navigator.geolocation){
	//该浏览器支持获取地理位置
 }else{
 	//该浏览器不支持获取地理位置
 }

方法：

1. getCurrentPosition(success(position),error(err),options) ：用于获取当前用户的地理位置。
   参数：
   • success(position)：success() 回调函数是在获取到地理信息时调用的，其中，position 参数是一个对象，包括以下属性。
     • latitude：表示纬度。
     • longitude：表示经度。
     • altitude：表示海拔高度。
     • accuracy：表示纬度和经度的精度，以米为单位。
     • latitudeAccuracy：表示海拔高度的精度，以米为单。
     • heading：表示设备的前进方向。
     • speed：表示设备的前进速度，以 m/s 为单位。
     • timestamp：获取位置的时间。
   • error(err)：error() 回调函数是在获取地理位置失败时调用的，其中，err 参数有两个属性 code 和 message。
     • code：1 表示用户拒绝了定位服务；2 表示获取不到位置信息；3 表示获取信息超时错误。
     • message：字符串，表示错误信息。
   • options：是一些可选属性的列表。
     • enableHighAccuracy：是否要求高精度的地理位置信息，属性值为布尔值，默认值为 false。
     • timeout：获取地理位置信息的超时时间（用户点击同意授权之后才开始计时）。如果超时，则返回获取信息超时错误的错误。属性值为数字，单位为毫秒，默认值为无穷大。
     • maximumAge：设置地理位置信息的缓存有效时间。如果该值为 0，那么每次定位时都会重新获取一个新的位置对象；如果该值不为 0，则缓存位置对象，再次定位时，如果朝过缓存有效期，则重新获取一个新的位置对象；如果没有超过缓存有效期，则直接获取缓存的位置对象。属性值为数字，单位为毫秒，默认值为 0。
2. watchPosition() ：返回用户的当前位置，并继续返回用户移动时的更新位置（就像汽车上的 GPS）。
3. clearWatch()：停止 watchPosition() 方法。

const getLocation = () => {
	if (!navigator.geolocation) {
		return '您的浏览器不支持获取地理位置信息，请手动选择地址'
	}

	navigator.geolocation.getCurrentPosition(
		position => {
			console.log('定位成功')
		},
		error => {
			console.log('失败')
		},
		{
			timeout: 6000,
			maximumAge: 1000 * 60 * 5,
		}
	)
}

重新唤起地址位置授权：

由于地址位置授权涉及用户隐私，因此一旦用户同意或拒绝，正常来说将浏览器不会再次弹起授权弹框。

可以手动使用一些方式来重新弹起授权弹框：

1. 对于 Mac 电脑上的 Chrome 浏览器：需要先在 Mac 电脑 的 系统偏好设置 --> 安全性与隐私 --> 隐私 --> 定位服务 中允许 Chrome 浏览器定位；然后在 Chrome 浏览器的 设置 --> 隐私设置和安全性 --> 网站设置 --> 位置信息 中允许网站定位。
   
   

2. 对于苹果手机上的微信内置浏览器：需要在 设置 --> 通用 --> 还原 --> 还原位置与隐私。

   清除微信缓存或者退出重新登录，都只能清除微信内置浏览器的缓存，而无法清除位置授权记录。