JS 中的 getCurrentPosition 在 iOS 上不起作用

Question

我有一个页面，其中包含从设备获取当前位置并使用此代码根据位置加载其他内容的代码：

if (navigator.geolocation) {
    navigator.geolocation.getCurrentPosition(successFunction);
} else {
    // Make API call to the GeoIP services
}

它适用于我测试过的所有 android 设备，但在 iOS 和 macOS 上，它不起作用。 if 和 else 都不是。似乎它卡在获取当前位置。

有什么帮助吗？

Answer 1

GeoLocation 仅在用户提供其权限时才有效。

确保确实如此。

This CodePen demo已经在iOS模拟器上用Safari测试，成功显示经纬度。

var options = {
  enableHighAccuracy: true,
  timeout: 5000,
  maximumAge: 0
};

function log(data) {
  const tag = document.createElement('p');
  tag.textContent = data;
  document.body.appendChild(tag);
}

function success(pos) {
  var crd = pos.coords;
  console.log('Successfully determined a user position:', crd);

  log('Your current position is:');
  log(`Latitude : ${crd.latitude}`);
  log(`Longitude: ${crd.longitude}`);
  log(`More or less ${crd.accuracy} meters.`);
}

function error(err) {
  console.warn(`ERROR(${err.code}): ${err.message}`);
}

navigator.geolocation.getCurrentPosition(success, error, options);

如果您的代码未命中 if 或 else，则不会出现这种情况，除非其他代码在您的代码中早些时候触发了无限循环。

Answer 2

如果 iOS 和 macOS 不允许或如果系统无法信任您，则不会向您提供用户的位置。所以：

- 首先（可能是你的答案）

它适用于您提供的确切代码仅当主机（又名来源）使用 https。这是由于您对以下答案的评论而导致权限警报未显示的原因。

记住如果你不使用https，它会卡住大约一分钟，然后返回一个关于身份验证失败的错误。使用 error 检查：

navigator.geolocation.getCurrentPosition(success, error, options)

它会告诉你这样的事情：

[blocked] 对地理位置的访问因不安全的连接而被阻止 到http://example.com。

提示：您可以在请求位置后刷新页面以跳过等待过程。但不要忘记检查检查器中的 Preserve Log 选项。

- 第二个：

如果您使用的是 https，请检查您的 Safari 位置设置，该设置可能以某种方式设置为“关闭”，您可以在此处进行更改：设置 > 隐私 > 位置服务 > Safari。这不是默认选项，但也许您不小心更改了它。因此，如果这是问题所在，请不要担心用户。如果您使用 Chrome 或任何其他第三方浏览器，请前往其设置并检查位置访问。默认情况下它不存在，只有在至少需要一次位置时才会出现。

- 第三个：

如果您要使用webView在应用中加载您的网站，请确保将位置权限描述添加到 info.plist强>文件。根据您的需要添加NSLocationWhenInUseUsageDescription 与NSLocationAlwaysUsageDescription 与NSLocationUsageDescription。

为了完整起见，在iOS13上，你无法获得always的权限。但这不是重点，重点是您必须在之前获得所需的权限，否则您需要从 GPS 获取位置，否则它根本不起作用。

Answer 3

我刚刚遇到了同样的问题。简单的答案是询问用户，在

中授予您的浏览器权限

Settings > Privacy > Location Services.

Answer 4

你需要检查三件事

您需要检查以下内容以了解您的程序为何无法访问用户的位置。您的代码应确保以下三点：

1. 用户的操作系统启用了定位服务。
2. 用户的浏览器支持检查定位服务。
3. 用户的浏览器启用了位置服务。

结合页面上的答案和一项额外的检查，我们可以处理所有这三种情况：

    /* Set up getCurrentPosition options with a timeout */
    const navigatorLocationOptions = {
      enableHighAccuracy: true,
      timeout: 5000,
      maximumAge: 0
    };

    /* Determine browser permissions status */
    navigator.permissions.query({name:'geolocation'})
      .then((result) => {
        /* result.state will be 'granted', 'denied', or 'error' */
        if (result.state === 'granted') {
          navigator.geolocation.getCurrentPosition(pos => {
             console.log('Retrieved user location', pos);
             /* Got the location! Write your successful code here. */            

          }, (error) => {
            /* System/OS location services disabled */
            console.log('System/OS services disabled', navigator);
            noLocationFound();
          }, navigatorLocationOptions);

        } else {
          /* Browser location services disabled or error */
          console.log('Browser location services disabled', navigator);
          noLocationFound();
        }
      }, (error) => {
        /* Browser doesn't support querying for permissions */
        console.log('Browser permissions services unavailable', navigator);
        noLocationFound()
      }
    );
    
    /* Handle no location found */
    function noLocationFound() {
      /* Write code here to handle: user location is unavailable */
    }

只需在noLocationFound() 函数中添加用户通知和回退的处理代码。