百度地图js API定位不准,浏览器开启后,定位不准

有时候开启VPN后,开启谷歌浏览器的位置服务,发现定位到外国了,

我的解决方案是,谷歌浏览器时,就提示用户需要关闭浏览器定位,这样就可以用百度地图的定位策略了。

最下面有相关代码

大部分现代浏览器使用的定位方式是基于 IP 地址、WiFi 网络、移动网络等信息的。
如果你的服务器在国外,那么浏览器可能会将服务器的 IP 地址作为用户的 IP 地址,从而导致定位到国外。
使用 VPN的话,vpn服务器如果在国外,那么就会定位到国外。

关闭浏览器的定位服务后,百度地图可能会使用基于IP 地址, GPS、WiFi 或者移动通信基站的定位方式,这些信息不需要浏览器的定位服务,
可以直接从设备或网络中获取,因此可得到更准确的结果。

谷歌浏览器使用的是 Google Location Services 来进行定位。
Google Location Services 的定位数据主要基于 IP 地址、WiFi 访问点和移动通信基站的信息,其中 IP 地址在很多情况下占据了主导作用。

火狐浏览器使用 Mozilla 的 Location Service 进行定位。这个服务基于公开和非公开的各种数据源,包括 WiFi 网络、IP 地址、GPS 和移动网络信号。
它甚至使用了一个名为 “stumbling” 的技术,这个技术通过收集并分析大量用户的匿名地理位置数据,来改善定位的准确性。

Edge 浏览器的定位服务依赖于 Microsoft 的 Location Services(Windows Location API)。
它使用的定位数据来源包括 GPS、Wi-Fi、移动网络、IP 地址等。
Microsoft’s Location Services 会根据这些信息进行复合定位,从而在多数情况下提供相对准确的定位信息。
在你的情况中,即使 Edge 浏览器所在的服务器 IP 是国外的,但其他的 Wi-Fi、GPS 或移动网络信号可能弥补了这一点,从而提供了更准确的定位。

代码如下:

initDefaultMap() {
            this.map = new BMapGL.Map("mapContainer");
            const point = new BMapGL.Point(116.404, 39.915);
            this.map.centerAndZoom(point, 15);
            //this.map.enableScrollWheelZoom(true);
            this.map.addControl(new BMapGL.ScaleControl());
            this.map.addControl(new BMapGL.ZoomControl());
            this.locationControl = new BMapGL.LocationControl({
                anchor: BMAP_ANCHOR_TOP_RIGHT,
                offset: new BMapGL.Size(20, 20),
                // 使用浏览器的 Geolocation API 进行定位
                enableAutoLocation: false
            });
            this.locationControl.addEventListener('locationSuccess', this.locateUser);
            this.map.addControl(this.locationControl);
 },
locateUser() {
            const isChrome = /Chrome/.test(navigator.userAgent) && /Google Inc/.test(navigator.vendor);
            if (isChrome) {
                // 检查浏览器是否支持 Geolocation
                if (navigator.geolocation) {
                    // 获取用户的地理位置
                    navigator.geolocation.getCurrentPosition(position => {
                        // const pointNew = new BMapGL.Point(position.coords.longitude, position.coords.latitude);
                        // this.map.panTo(pointNew);
                        setTimeout(() => {
                            const point = new BMapGL.Point(116.404, 39.915);
                            this.map.centerAndZoom(point, 15);
                        }, 2000);
                        alert('请在浏览器设置中,禁止使用位置服务。');
                    }, error => {
                        console.log('navigator.geolocation,已禁止获取位置信息');
                    });
                } else {
                    // 如果浏览器不支持 Geolocation,使用 BMapGL.Geolocation
                    const geolocation = new BMapGL.Geolocation();
                    geolocation.getCurrentPosition(r => {
                        if (geolocation.getStatus() == BMAP_STATUS_SUCCESS) {
                            // const pointNew = new BMapGL.Point(r.point.lng, r.point.lat);
                            // this.map.panTo(pointNew);
                            setTimeout(() => {
                                const point = new BMapGL.Point(116.404, 39.915);
                                this.map.centerAndZoom(point, 15);
                            }, 2000);
                            alert('请在浏览器设置中,禁止使用位置服务。');
                        } else {
                            // 处理错误
                            console.log('BMapGL.Geolocation,已禁止获取位置信息');
                        }
                    });
                }
            }
        },
  • 9
    点赞
  • 7
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

xingchen678

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值