如何使用 Gmap 在浏览器地理定位中处理用户批准?

     2023-02-23     117

关键词:

【中文标题】如何使用 Gmap 在浏览器地理定位中处理用户批准?【英文标题】:How to handle user approval in browser geolocation with Gmap? 【发布时间】:2013-07-11 18:06:45 【问题描述】:

我正在与 Gmaps 一起构建 HTML5 地理定位功能。

我在等待用户批准进行地理定位时遇到了一个小问题:浏览器询问用户是否要进行地理定位。当他单击“是”时,他已被定位,但未触发 gmap 并且地图未显示在屏幕上。然后,如果他刷新它,一切正常。这特别发生在手机上。

我在处理地理定位的事情时给出一段代码:

    <script>
    // <!-- GOOGLE MAPS & POSITION -->

    var radius = 1;
    var map;
    var position;

    jQuery(window).ready(function() 
        //If we click on Find me Lakes
        jQuery("#btnInit").click(initiate_geolocation);
        initiate_geolocation();

        $('#radius').change(function(v)
            handle_geolocation_query(position);
        );
    );

    function initiate_geolocation()  
        if (navigator.geolocation)  
          
            var script = document.createElement("script");
            script.type = "text/javascript";
            script.src = "https://maps.googleapis.com/maps/api/js?key=AIzaSyBbfJJVh0jL1X9b7XFDcPuV7nHD1HlfsKs&sensor=true&callback=initialize";
            document.body.appendChild(script);
            navigator.geolocation.getCurrentPosition(append_google_map, handle_errors);
          
        else  
          
            yqlgeo.get('visitor', normalize_yql_response);
          
    

    function handle_errors(error)  
      
        switch(error.code)  
          
            case error.PERMISSION_DENIED: alert("user did not share geolocation data");  
            break;  
            case error.POSITION_UNAVAILABLE: alert("could not detect current position");  
            break;  
            case error.TIMEOUT: alert("retrieving position timedout");  
            break;  
            default: alert("unknown error");  
            break;  
          
      

    function append_google_map(pos) 

        position = pos;

        var mapOptions = 
            zoom: 15,
            center: new google.maps.LatLng(position.coords.latitude, position.coords.longitude),
            streetViewControl: false,
            mapTypeId : google.maps.MapTypeId.ROADMAP
        

        if (typeof map == 'undefined')  //We make sure the map object hasn't been toogled to the page

            map = new google.maps.Map(document.getElementById("gmap"), mapOptions);

            //$('#gmap').slideToggle('slow');

            setMarkerPosition(position.coords.latitude, position.coords.longitude);

        

        handle_geolocation_query();
    

正如您在此处看到的,我正在使用错误回调和成功回调在启动函数中启动地理定位内容。那时用户屏幕上会出现一个弹出窗口,询问他是否批准地理位置。即使他点击是,似乎代码的某些部分没有被触发(或者我们被重定向到 handle_errors 不知道),因此,地图不会出现在屏幕上(它在代码中的处理得更进一步append_google_map。

谁能帮我弄清楚为什么会发生这种情况以及如何处理?

非常感谢

【问题讨论】:

【参考方案1】:

您不能,这是一项安全功能。您的代码必须等待用户批准或拒绝他们是否要分享他们的位置。

您的代码必须能够对用户的两种响应做出反应。如果他们选择不分享您的代码,您可以尝试回退到城市的坐标,或显示一些消息。

只要您向他们解释为什么他们与您分享他们的位置,可以在页面上显示一条消息告诉他们分享他们的位置。

【讨论】:

嘿,谢谢 Samer,但我已经理解并实现了那部分,看看我的代码。我的问题更像是脚本在用户接受地理定位后无法成功触发。我认为当用户接受地理定位时,navigator.geolocation.getCurrentPosition(append_google_map, handle_errors); 不会调用“append_google_map”。一旦他点击okay,geolocate me,然后什么都没有发生。为什么 ?调用成功函数是处理它的正确方法吗?谢谢 可能是因为尚未加载 Google 地图库。如果您在 URL 中看到加载库,最后您有一个 callback=initialize,因此请尝试在您的 JS 中创建一个名为 initialize 的函数,并确保它可以通过全局范围或 window.initialize = function... 访问,并将您的地理位置放在其中.这就是我通常的做法。

浏览器内地理定位功能:如何在用户拒绝后提示用户重新启用?

】浏览器内地理定位功能:如何在用户拒绝后提示用户重新启用?【英文标题】:In-browsergeolocationfeature:howcanIprompttheusertoreenableafterthey\'vedeniedit?【发布时间】:2014-11-0519:39:14【问题描述】:类似于thisquestion,但就我而言,我是网... 查看详情

(反应原生)如何使用地理定位将地图视图集中在用户身上

】(反应原生)如何使用地理定位将地图视图集中在用户身上【英文标题】:(reactnative)HowtocentermapviewonuserusingGeolocation【发布时间】:2021-09-0711:15:41【问题描述】:如何使用Geolocation.getCurrenPosition()以便返回用户的纬度和经度【问... 查看详情

现在还支持navigator.geolocation定位吗?

...能正常获取地理位置,可能是由于以下几点原因造成的:浏览器不支持地理位置获取功能。目前,只有主流浏览器都支持地理位置获取功能。如果你使用的是一些过时或不常用的浏览器,可能会导致获取地理位置失败。用户没有... 查看详情

IE11 中的地理定位问题

...有以下代码,当用户单击/点击位置链接时,请求用户在浏览器中允许他们当前的位置。这在Chrome、Safari和Firefox中运行良好,但我无法在IE11中运行。有时它会显示浏览器通知,让用户提供他们的位置,但随后什么也没有发生。我... 查看详情

如何在我的浏览器中模拟纬度和经度值(用于地理定位测试)?

】如何在我的浏览器中模拟纬度和经度值(用于地理定位测试)?【英文标题】:Howtosimulatelatitudeandlongitudevaluesinmybrowser(forgeolocationtesting)?【发布时间】:2011-07-2806:39:44【问题描述】:我正在开发一个网络应用程序,它需要我在... 查看详情

如何使用此地理定位脚本缓存用户的位置?

】如何使用此地理定位脚本缓存用户的位置?【英文标题】:HowwouldIcachethelocationoftheuserwiththisgeolocationscript?【发布时间】:2011-09-0818:20:02【问题描述】:我将如何缓存用户的位置,以便在用户点击后退按钮或多次访问该网站时不... 查看详情

为啥在 HTML5 支持地理定位的情况下在移动应用中使用 PhoneGap?

...问题描述】:我目前正在开发一个需要用户当前位置并在浏览器中运行的移动应用程序。我进行了一些搜索,发现人们推荐P 查看详情

用户地理位置 - 案例研究

...关如何实现此目标的最佳做法的建议。我记住,并非所有浏览器都支持地理定位,即使支持,用户也可能拒绝地理定位权限。我在想这样的场景: 查看详情

Safari 中的 html5 地理定位错误

...5地理定位和本地存储制作网站,我使用的是JS,在大多数浏览器中一切正常,但我在使用Safary时遇到了一些问题:解释如下:单击按钮时,我想为用户获取GEO位置,将其保存在本地存储中,稍后检索信息并将其发送到电子邮件。... 查看详情

如何在没有警报消息(iOS)的情况下在 webview 中获得地理定位许可?

】如何在没有警报消息(iOS)的情况下在webview中获得地理定位许可?【英文标题】:Howtogetpermissionforgeolocationinwebviewwithoutalertmsg(iOS)?【发布时间】:2012-03-3003:43:39【问题描述】:我有一个应用程序可以在webview上加载我的网站。... 查看详情

无法在 jxbrowser-java 中设置地理定位权限

...个java应用程序,它使用jxbrowser显示用户位置。(我们在浏览器控制台中打印位置并在java中使用控制台侦听器获取它)在我的getLocation.java中:publicstaticvoidmain(S 查看详情

高级功能使用地理定位

...可以获取用户当前地理位置的信息(或者至少是正在运行浏览器的系统的位置)。它不是HTML5规范的一部分,但经常被归组到与HTML5相关的新功能中。1.使用地理定位我们通过全局属性navigator.geolocation访问地理定位功能,它会返回... 查看详情

如何使用谷歌地理定位 API?

】如何使用谷歌地理定位API?【英文标题】:HowtoworkwithGooglegeolocationAPI?【发布时间】:2017-04-1309:19:07【问题描述】:我正在开展一个网络开发项目,我需要在该项目中获取用户的确切位置信息(例如地区、城市、州和国家/地区... 查看详情

如何每分钟重新加载地理定位 Javascript?

...问题描述】:我使用GeolocationJavaScript制作了一个原型,在浏览器中它显示了一个带有多个标记的地图和一个带有您当前位置的标记。在这个时候,我想让我的网站自动重新加载,这样你就可以看到你的新位置(如果你搬家)。现... 查看详情

17html5地理定位

...非用户同意,否则用户位置信息是不可用的注意:大部分浏览器都支持 Geolocation(地理定位),对于拥有GPS的设备,比如iPhone,地理定位更加精确 使用HTML5地理定位请使用getCurrentPosition()方法来获得用户的位置下例是一个... 查看详情

为啥地理定位在 Safari 桌面中失败?

...【问题描述】:我尝试使用地理定位,它适用于我所有的浏览器,除了safari。这是我正在运行的脚本。if(navigator.geolocation)navigator.geolocation.getCurrentPosit 查看详情

如何在asp.net中自动启用浏览器位置设置

】如何在asp.net中自动启用浏览器位置设置【英文标题】:Howtoautomaticallyenablebrowserlocationsettinginasp.net【发布时间】:2013-08-0519:02:33【问题描述】:我想自动启用浏览器地理定位,因为我在访问地理定位以允许或拒绝时收到一个确... 查看详情

离子应用程序的地理定位错误在浏览器上有效,但在安卓手机上无效

】离子应用程序的地理定位错误在浏览器上有效,但在安卓手机上无效【英文标题】:Geolocationerrorforionicappisworkonbrowserbutnotworkonandroidmobile【发布时间】:2015-07-0407:17:27【问题描述】:我正在开发一个基于地图的项目,在该项目... 查看详情