腾讯网网站内容定位(一下下的http网页禁止了geolocationapi的调用，原因是什么？)

　　腾讯网网站内容定位(一下下的http网页禁止了geolocationapi的调用，原因是什么？)

　　iOS10下的http网页禁止调用geolocation api。原因是出于安全考虑，这个时候只要升级到https协议，就可以正常使用geolocation api了。这是最推荐的方案，因为从大势来看，很多浏览器厂商都开始禁止在http下调用geolocation，所以为了避免一劳永逸的问题，建议全程切换到https地点。

　　但是，我们的一些应用程序不能立即切换到https，仍然需要兼容http的使用。这个时候我们应该怎么做？

　　兼容方案：借助地图供应商api

　　目前可以使用各大地图厂商（如腾讯地图、百度地图、谷歌地图）提供的API来帮助我们解决这个问题。

　　下面我们来仔细看看如何调用每张地图的定位服务：

　　腾讯地图

　　引入腾讯地图前端定位组件

　　调用api

　　var geolocation = new qq.maps.Geolocation("OB4BZ-D4W3U-B7VVO-4PJWW-6TKDJ-WPB77", "myapp");

geolocation.getLocation(showPosition, showErr);

function showPosition(result) {

console.log('您的位置：'+ result.lng + ',' + result.lat );

};

function showErr(err) {

console.log(err)

};

　　百度地图

　　引入百度地图（百度地图不像腾讯地图那样有单独的定位组件，所以需要引入整个地图的js-sdk）

　　调用api

　　var geolocation = new BMap.Geolocation();

geolocation.getCurrentPosition(function(result){

if(this.getStatus() == window.BMAP_STATUS_SUCCESS){

console.log('您的位置：' + result.point.lng + ',' + result.point.lat );

} else {

console.log('failed:'+this.getStatus());

}

},{enableHighAccuracy: true})

　　高德地图

　　介绍高德地图（还需要输入整个js-sdk。由于高德使用插件的形式调用定位功能，需要提前将地图DOM加载到页面中。）

　　调用api

　　var map, geolocation;

//加载地图，调用浏览器定位服务

map = new AMap.Map('container', {

resizeEnable: true

});

map.plugin('AMap.Geolocation', function() {

geolocation = new AMap.Geolocation();

geolocation.getCurrentPosition();

AMap.event.addListener(geolocation, 'complete', onComplete);//返回定位信息

AMap.event.addListener(geolocation, 'error', onError); //返回定位出错信息

});

//解析定位结果

function onComplete(data) {

console.log('您的位置：' + result.position.lng + ',' + result.position.lat );

}

//解析定位错误信息

function onError(error) {

console.log(error)

}

　　四种定位方式返回数据的差异

　　综合解决方案

　　通过上面的介绍，我们发现各大地图的调用方式和返回格式是不同的。针对这个问题，我写了一个工具geo-for-http，提供腾讯地图、百度地图、高德地图的定位服务，而不是原生的。HTML5的无效定位功能，帮你在iOS10下使用http正常定位。

　　总体设计思路是：

　　三统一：统一注册方式、统一调用方式、统一数据返回格式。

　　具体使用方法请点击下方链接，欢迎大家评论~

　　传送门：zyf394/geo-for-http