Question

我正在尝试使用权限API：https://developer.mozilla.org/en-US/docs/Web/API/Permissions/query Firefox应该支持哪个。（我目前正在使用 Firefox Developer Edition 66.0b14 ）。

我有一个最初检查用户权限的页面。像这样的东西

if (navigator.permissions) {
  navigator.permissions.query({ name: 'geolocation' }).then(result => {
    if (result.state === 'granted') {
      this.getCurrentPosition()
    } else if (result.state === 'prompt') {
      this.getCurrentPosition()
      console.log('Permissions requested. Waiting for user input...')
    } else if (result.state === 'denied') {
      this.locationError = true
    }
    result.onchange = event => {
      if (event.target.state === 'granted') {
        this.locationError = false
        this.getCurrentPosition()
        console.log('Thanks for letting us know...')
      } else if (event.target.state === 'denied') {
        this.locationError = true
      }
    }
  })
}

例如，现在这在Chrome中一切正常。（顺便说一句：我使用this.locationError来显示一些信息窗口，说该应用程序仅在启用了位置服务的情况下才能使用）

无论如何，如果我在Firefox中打开它，则会得到提示，如下所示：现在，如果我选中``记住此决定''框并发送允许/阻止，则发现onchange已按预期执行，这使我有可能对用户的决定做出反应。

但是，如果我不选中此框，而只是拒绝或允许一次，则不会调用onchange，这使我不知道实际发生了什么。同样，该状态仍处于“提示”状态。

我还尝试设置一个时间间隔，以便在一段时间后再次检查“权限”，但是它只会打开询问权限的提示。状态永远不会从“提示”更新或更改为“拒绝”或“授予”。

是否缺少某些内容，或者这是Firefox错误。

感谢任何提示

欢呼

Answer 1

我无法让 onchange 函数或 change 事件适用于 Firefox，但能够找到一种解决方法，该方法同样适用于识别权限更改：

注意：此修复仅在您使用 geolocation.getCurrentPosition

时有效

  navigator.permissions.query({
    name: 'geolocation'
  }).then(function(result) {
      
    const onLocationFetchSuccess = (position) => {
      /*
         Consume location coordinates here and proceed as required
         using position.coords.latitude and position.coords.longitude
      */
    };

    const onLocationFetchFailure = (error = {}) => {
      // Error code 1 corresponds to user denying/blocking the location permission
      if (error.code === 1) {
        // Respond to failure case as required
      }
    };

    navigator.geolocation.getCurrentPosition(onLocationFetchSuccess, onLocationFetchFailure);

    if (result.state === 'denied') {
      onLocationFetchFailure();
    }

    // This will still work for Chrome
    result.onchange = function() {
      if (result.state === 'denied') {
        onLocationFetchFailure();
      }
    }
  })

对于 Chrome 浏览器，此解决方案将触发两次失败案例。为了避免这种情况，可以检查当前浏览器以有条件地阻止将 onLocationFetchFalure 回调发送到 Chrome 浏览器的 getCurrentPosition。

TLDR;这里的解决方法是，我们不依赖于 change 事件/onchange 函数来触发，而是将错误回调传递给 getCurrentPosition，当通过权限更改位置权限时会触发该回调对话。当用户拒绝/阻止位置权限时，此错误回调会提供错误代码 1。

Navigator.permissions.query：地理onChange在Firefox中不起作用

1 个答案: