Position - Web API | MDN WEB定位API文档地址
引入wx-jsdk
html
<script type="text/javascript" src="https://res.wx.qq.com/open/js/jweixin-1.3.2.js"></script>
返回小程序操作
javascript
let path = "/pages/home/back";
jWeixin.miniProgram.redirectTo({url:path })
HTML页面代码
html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>WEB定位</title>
<!-- cdn 引入 -->
<script type="text/javascript" src="https://res.wx.qq.com/open/js/jweixin-1.3.2.js"></script>
</head>
<body>
<div class="mapinfo"></div>
<div class="xiedai">携带信息:</div>
<div class="fanhui">返回</div>
<script>
if (navigator.geolocation) {
// 解析网页携带参数 code
var code = location.search.split('=')[1] || '无';
console.log(code);
// alert( ' 浏览器支持 geolocation ' );
// navigator.geolocation.getCurrentPosition(success, error, options);
navigator.geolocation.getCurrentPosition(function(position){
console.log(position);
var lat = position.coords.latitude; // 纬度
var lng = position.coords.longitude; // 经度
var alt = position.coords.altitude; // 海拔
var acc = position.coords.accuracy; // 精度
var spd = position.coords.speed; // 速度
var hdg = position.coords.heading; // 方向
var tms = position.timestamp; // 时间戳
console.log(lat,lng,alt,acc,spd,hdg,tms);
mapinfo = document.querySelector('.mapinfo');
mapinfo.innerHTML = `
<p>纬度:${lat}</p>
<p>经度:${lng}</p>
<p>海拔:${alt}</p>
<p>精度:${acc}</p>
<p>速度:${spd}</p>
<p>方向:${hdg}</p>
<p>时间戳:${tms}</p>
支持
`;
// 携带信息
var xiedai = document.querySelector('.xiedai');
xiedai.innerHTML = `
携带信息:${code}
`;
},function(err){
console.log(err);
},{
enableHighAccuracy: true, // 高精度
timeout: 5000, // 超时
maximumAge: 0 // 最大时间
})
}else{
mapinfo = document.querySelector('.mapinfo');
mapinfo.innerHTML = `
不支持
`;
// 携带信息
var xiedai = document.querySelector('.xiedai');
xiedai.innerHTML = `
携带信息:${code}
`;
}
// 返回
var fanhui = document.querySelector('.fanhui');
fanhui.onclick = function(){
jWeixin.miniProgram.redirectTo({url: '/pages/home/index'})
}
</script>
</body>
</html>
HTTPS
协议说明:IOS 内核 浏览器 强制需要HTTPS安全协议支持、否则不通过。
浏览器兼容性
