備注：頁(yè)面必須在https下，并且用戶選擇拒絕授權(quán)，之后會(huì)一直返回用戶拒絕授權(quán)，在瀏覽器中，只能清除位置信息
用到的服務(wù)
- h5獲取定位的api navigator.geolocation.getCurrentPosition
- 新浪獲取ip的接口 https://pv.sohu.com/cityjson?ie=utf-8
- 百度的地址解析
代碼
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>my-project</title>
</head>
<body>
<p id="demo">點(diǎn)擊這個(gè)按鈕，獲得您的坐標(biāo)：</p>
*******************************************************
<p id="demo1"></p>
<p><button onclick="getLocation()">試一下1</button></p>
*******************************************************
<p><button onclick="locationByIp()">ip定位</button></p>
<script src="https://pv.sohu.com/cityjson?ie=utf-8"></script>
<script src="https://cdn.bootcss.com/jquery/3.1.1/jquery.min.js"></script>
<script>
var x=document.getElementById("demo");
var x1=document.getElementById("demo1");
function getLocation(){
if (navigator.geolocation){
x1.innerHTML=JSON.stringify(navigator)
navigator.geolocation.getCurrentPosition(showPosition,showError,{
enableHighAcuracy : true,// 指示瀏覽器獲取高精度的位置，默認(rèn)為false
timeout : 5000,// 指定獲取地理位置的超時(shí)時(shí)間，默認(rèn)不限時(shí)，單位為毫秒
maximumAge : 2000 // 最長(zhǎng)有效期，在重復(fù)獲取地理位置時(shí)，此參數(shù)指定多久再次獲取位置。
});
}else{
locationByIp();
x.innerHTML="Geolocation is not supported by this browser.";
console.log("Geolocation is not supported by this browser.");
}
}
function showPosition(position){
x.innerHTML="Latitude: " + position.coords.latitude + "<br />Longitude: " + position.coords.longitude;
console.log("Latitude: " + position.coords.latitude + "<br />Longitude: " + position.coords.longitude);
}
// 上面的代碼可以知道，如果用戶設(shè)備支持地理定位，則運(yùn)行 getCurrentPosition() 方法。如果getCurrentPosition()運(yùn)行成功，則向參數(shù)showPosition中規(guī)定的函數(shù)返回一個(gè)coordinates對(duì)象，getCurrentPosition() 方法的第二個(gè)參數(shù)showError用于處理錯(cuò)誤，它規(guī)定當(dāng)獲取用戶位置失敗時(shí)運(yùn)行的函數(shù)。
// 我們先來看函數(shù)showError()，它規(guī)定獲取用戶地理位置失敗時(shí)的一些錯(cuò)誤代碼處理方式：
showError=(error)=>{
locationByIp();
switch(error.code) {
case error.PERMISSION_DENIED:
alert("定位失敗,用戶拒絕請(qǐng)求地理定位");
break;
case error.POSITION_UNAVAILABLE:
alert("定位失敗,位置信息是不可用");
break;
case error.TIMEOUT:
alert("定位失敗,請(qǐng)求獲取用戶位置超時(shí)");
break;
case error.UNKNOWN_ERROR:
alert("定位失敗,定位系統(tǒng)失效");
break;
}
};
function locationByIp() {
var localtion={};
localtion.ip = returnCitySN.cip;
// 通過百度api獲得經(jīng)緯度
$.getJSON("https://api.map.baidu.com/location/ip?callback=?", {
// 'ak' : 'x2CC5dtMtwjAAe6epLt2s1Kxs0BmSxPu',
'ak' : 'lApvxfMWyOB9So5CZUOupRGg7wLYlbGx',
'coor' : 'bd09ll',
'ip' : localtion.ip
}, function(data) {
localtion.province = data.content.address_detail.province;
localtion.city = data.content.address_detail.city;
localtion.district = data.content.address_detail.district;
x1.innerHTML=JSON.stringify(data.content);
});
// $.get(`http://ip.taobao.com/service/getIpInfo.php?ip=${localtion.ip}`,function(data){
// showLocation(JSON.parse(data))
// })
}
function showLocation(){
$.get(`http://gc.ditu.aliyun.com/geocoding?a=${returnCitySN.cname}`,function(res){
})
}
</script>
</body>
</html>
