navigator.geolocation getCurrentPosition 未在 Chrome Mobile 中更新 [英] navigator.geolocation getCurrentPosition not updating in Chrome Mobile

问题描述

我创建了一个站点(可以在 http://dev.gkr33.com 上访问)，它是专为智能手机设计，并尝试使用 navigator.geolocation api 并通过 getCurrentPosition 获取您的位置.这最初似乎有效，但是如果您尝试刷新页面，它总是会带回最后的 GPS 位置.我在页面上添加了一些调试信息，它抓取 getCurrentPosition 返回的时间，并且在初始定位后它总是返回相同的时间(低至毫秒).

I have created a site (can be accessed at http://dev.gkr33.com) which is designed for a smartphone and attempts to use the navigator.geolocation api and grab your position via getCurrentPosition. This seems to work initially, however if you try to refresh the page it always brings back the last GPS position. I have added some debug information on the page which grabs the time of the getCurrentPosition return and after the initial positioning it always returns the same time (down to the millisecond).

这似乎只发生在 Chrome 移动版中.如果我通过现有的 Android 浏览器浏览该网站，则每次都可以正常工作.

This only seems to happen in Chrome Mobile. If I browse into the site via the stock Android browser it works fine every time.

代码如下所示；

<script type="text/javascript">
    (function ($) {
    $(document).ready(function() {
        var options = { enableHighAccuracy: true, maximumAge: 0, timeout: 60000 };
        var position;

        // empty the current html elements, not strictly necessary but
        // I'm clutching at straws
        $('#debug-latlng').empty();
        $('#debug-time').empty();
        $('#debug-address').empty();

        // Let's try and find out where we are
        if(navigator.geolocation) {
            navigator.geolocation.getCurrentPosition(gotPos, gotErr, options ); 
        } else {
            gotErr();
        }

        // We've got our position, let's show map and update user
        function gotPos(position) {
            var info;
            info = position.coords.latitude+','+position.coords.longitude;
            $('#debug-latlng').text(info);
            $('#debug-time').text(parseTimestamp(position.timestamp));

            // the following json call will translate the longitude and
            // latitude into an address (a wrapper for google's geocode call)

            $.getJSON('http://dev.gkr33.com/api.php', { req: "getLocationInfo", latlng: $('#debug-latlng').text() }, function(json) {
                $('#debug-address').text( json['results'][0]['formatted_address'] );
            });

            var myLatLng = new google.maps.LatLng( position.coords.latitude, position.coords.longitude );
            var mapOptions = {
                    zoom: 12,
                    center: myLatLng,
                    mapTypeId: google.maps.MapTypeId.ROADMAP
            };      
            var map = new google.maps.Map(document.getElementById('map_canvas'), mapOptions);

            var marker = new google.maps.Marker({
                position: myLatLng, 
                title: 'You are here',
                animation: google.maps.Animation.DROP 
            });
            marker.setMap(map);
        } //gotPos


        // Trap a GPS error, log it to console and display on site
        function gotErr(error) {
            var errors = { 
                    1: 'Permission denied',
                    2: 'Position unavailable',
                    3: 'Request timeout'
                };
            console.log("Error: " + errors[error.code]);
            $('#debug-latlng').text('GPS position not available');
        } //gotErr

        // Make timestamp human readable
        function parseTimestamp(timestamp) {
            var d = new Date(timestamp);
            var day = d.getDate();
            var month = d.getMonth() + 1;
            var year = d.getFullYear();
            var hour = d.getHours();
            var mins = d.getMinutes();
            var secs = d.getSeconds();
            var msec = d.getMilliseconds();
            return day + "." + month + "." + year + " " + hour + ":" + mins + ":" + secs + "," + msec;
        } // parseTimestamp     
    });         
}) (jQuery);
</script>

我使用过 maxAge 和 timeout 的各种值，但似乎没有任何东西影响相同的 position.coords 和 position.time 值.

I have played around with various values for the maximumAge and timeout, but nothing seems to affect the same position.coords and position.time values.

我认为 Chrome Mobile 可能存在问题，但我现在不想假设太多，只需要澄清一下，我没有在代码中犯类似布偶的错误.

I think there maybe an issue with Chrome Mobile, but I don't wanna assume too much at this point in time and just need clarification that I haven't made a mistake of muppet-like proportions in my code.

非常感谢您提供的任何帮助.

Many thanks for any help you can provide.

更新:我想我应该说我已经在两个 Android 设备上测试过了；HTC One X+ 和三星 Galaxy Tab 7.7 的结果相同.在两个股票浏览器上都可以正常工作，并且在两个 Chrome 上都不会刷新位置.稍后将在 Apple 设备上进行测试 :)

UPDATE: I suppose I should have said that I have tested this on two Android devices; HTC One X+ and a Samsung Galaxy Tab 7.7 with the same result. On both the stock browser works fine, and on both Chrome doesn't refresh the position. Will test on an Apple Device later :)

推荐答案

我从来没有深入到这个问题的根源，但是我通过使用 watchPosition 调用和包装解决了这个问题在清除 watchID 之前等待 5 秒.检查下面的代码:

I never got to the bottom of this issue, but I got a way around the problem by utilising the watchPosition call, and wrapping this in a 5 second wait before clearing the watchID. Check the code below:

var options = { enableHighAccuracy: true, maximumAge: 100, timeout: 50000 };
if( navigator.geolocation) {
   var watchID = navigator.geolocation.watchPosition( gotPos, gotErr, options );
   var timeout = setTimeout( function() { navigator.geolocation.clearWatch( watchID ); }, 5000 );
} else {
   gotErr();
}

我目前还没有尝试过选项"值或超时延迟，但上面的代码在我尝试过的每个平台上都带回了准确的定位信息.

I haven't played around with the "options" values or the timeout delay at the moment, but the above code brings back accurate positioning info on every platform I've tried.

希望这对有同样问题的人有所帮助:)

Hope this helps someone with the same issue :)

这篇关于navigator.geolocation getCurrentPosition 未在 Chrome Mobile 中更新的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！