微信公众号开发之获取用户地理位置微信公众号需要设置JS安全访问域名
域名设置请不要加上https:
如果你的域名是https://mp.csdn.net/postedit
请设置为:mp.csdn.net/postedit
1、后台获取验证签名信息
信息获取:可以看我上一篇文章:https://blog.csdn.net/bthinker/article/details/80910593
<input type="hidden" id="appId" name="appId" value="${jssdkMap.appId}"/>
<input type="hidden" id="timestamp" name="timestamp" value="${jssdkMap.timestamp}"/>
<input type="hidden" id="nonceStr" name="nonceStr" value="${jssdkMap.nonceStr}"/>
<input type="hidden" id="signature" name="signature" value="${jssdkMap.signature}"/>
2、调用方法
$(function() {
jsSdk();
});
3、地理位置信息保存
<input type="hidden" id="latitude" name="latitude" value=""/>
<input type="hidden" id="longitude" name="longitude" value=""/>
3、获取信息
function jsSdk(){
wx.config({
debug: false, // 开启调试模式,调用的所有api的返回值会在客户端alert出来,若要查看传入的参数,可以在pc端打开,参数信息会通过log打出,仅在pc端时才会打印。
appId: $("#appId").val(), // 必填,公众号的唯一标识
timestamp:$("#timestamp").val(),// 必填,生成签名的时间戳
nonceStr: $("#nonceStr").val(),// 必填,生成签名的随机串
signature: $("#signature").val(),// 必填,签名,见附录1
jsApiList: [ 'checkJsApi', 'openLocation', 'getLocation'] // 必填,需要使用的JS接口列表,所有JS接口列表见附录2
});
wx.checkJsApi({
jsApiList: ['getLocation'], // 需要检测的JS接口列表,所有JS接口列表见附录2,
success: function(res) {
if (res.checkResult.getLocation == false) {
alert("你的微信版本太低,不支持微信JS接口,请升级到最新的微信版本!");
return;
}
}
});
var latitude;
var longitude;
var speed;
var accuracy;
wx.ready(function(){
// config信息验证后会执行ready方法,所有接口调用都必须在config接口获得结果之后,config是一个客户端的异步操作,所以如果需要在页面加载时就调用相关接口,则须把相关接口放在ready函数中调用来确保正确执行。对于用户触发时才调用的接口,则可以直接调用,不需要放在ready函数中。
wx.getLocation({
success : function(res) {
latitude = res.latitude; // 纬度,浮点数,范围为90 ~ -90
longitude = res.longitude; // 经度,浮点数,范围为180 ~ -180。
/* speed = res.speed; // 速度,以米/每秒计 */
accuracy = res.accuracy; // 位置精度
$("#latitude").val(latitude);
$("#longitude").val(longitude);
console.log(latitude);
console.log(longitude);
},
cancel : function(res) {
alert("未能获取地理位置");
}
});
});
wx.error(function(res){
// config信息验证失败会执行error函数,如签名过期导致验证失败,具体错误信息可以打开config的debug模式查看,也可以在返回的res参数中查看,对于SPA可以在这里更新签名。
alert("验证出错");
});
}