navigator.geolocation.watchPosition 在 MacOS Monterey 上失败 google chrome

Question

我正在使用 chrome 浏览器和 MacOS Monterey 编写一个 angular 14 应用程序，我正在尝试让用户在浏览器上使用当前地理位置，以便用@angular/google-maps api.

所以在组件的 ngOnInit() 我有以下代码：

  ngOnInit(): void {
    navigator.geolocation.watchPosition((position) => {
      this.center = {
        lat: position.coords.latitude,
        lng: position.coords.longitude,
      }
    },function(positionError){
  alert('User not allowed - ' + positionError.message);
    },{timeout:10000})
  }

因此显示警报 User not allowed - User defined Geolocation。

我尝试 google 并阅读了关于 Whosebug 的问题，我读到我现在必须使用 ssl。

所以我运行开发环境使用ng serve --ssl，浏览器请求获取当前位置的权限但是结果一样，还是报错

我错过了什么？

Answer 1

我注意到浏览器有一个图标，显示我的 MacOS 上未启用定位服务，我禁用了它并 re-enabled 现在它可以工作了。

添加权限 api 把事情搞砸了，我的常规代码足以让用户允许权限，然后获取位置

Answer 2

我觉得这听起来很奇怪，但让我告诉你最好的测试方法，因此我的测试，每次你实时保存 component/html 时它都会失败（称之为实时重新加载）。

让我们在每次测试中按 F5（刷新），你会得到你的结果，你的代码没问题，但你需要手动刷新才能获取数据，如果你只是重新加载页面，你会得到类似“错误 3，超时”的信息，让我们测试一下，让我知道它是否适合您。

我的例子：https://stackblitz.com/edit/angular-ivy-txnone?file=src/app/app.component.html

navigator.geolocation.watchPosition 在 MacOS Monterey 上失败 google chrome

navigator.geolocation.watchPosition fails on MacOS Monterey with google chrome

angular

google-chrome

geolocation