React-Native's navigator.geolocation is undefined

Question

console.log(navigator.geolocation) //undefined

console.log(navigator):

WorkerNavigator {hardwareConcurrency: 8, appCodeName: "Mozilla", appName: "Netscape", appVersion: "5.0 (Macintosh; Intel Mac OS X 10_14_3) AppleWebKi…L, like Gecko) Chrome/73.0.3683.103 Safari/537.36", …}
appCodeName: "Mozilla"
appName: "Netscape"
appVersion: "5.0 (Macintosh; Intel Mac OS X 10_14_3) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/73.0.3683.103 Safari/537.36"
connection: NetworkInformation {onchange: null, effectiveType: "4g", rtt: 100, downlink: 4.3, saveData: false}
deviceMemory: 8
hardwareConcurrency: 8
language: "en-US"
languages: (3) ["en-US", "en", "es"]
locks: LockManager {}
onLine: true
permissions: Permissions {}
platform: "MacIntel"
product: (...)
storage: StorageManager {}
usb: USB {onconnect: null, ondisconnect: null}
userAgent: "Mozilla/5.0 (Macintosh; Intel Mac OS X 10_14_3) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/73.0.3683.103 Safari/537.36"
get product: ƒ getValue()
set product: ƒ setValue(newValue)
__proto__: WorkerNavigator

I am using React Native 0.59 on iOS.

In info.plist, I have both: Privacy - Location When In Use Usage Description and Privacy - Location Always and When In Use Usage Description

CocoaPods: http://dpaste.com/2W9Y57E Info.plist: http://dpaste.com/1CTG8GP

Answer 1

该WorkerNavigator接口表示允许从访问的Navigator接口的子集Worker。为每个工作程序初始化这样的对象，并且可以通过WorkerGlobalScope.navigator调用获得的属性使用该对象window.self.navigator。

在Worker该界面的Web API的工人表示可以很容易地创建，并且可以将消息发送回它的创造者后台任务。创建工作程序就像调用Worker()构造函数并指定要在工作程序线程中运行的脚本一样简单。

navigator在任何网页上运行都会返回一个Navigator实例

>> navigator
Navigator { permissions: Permissions, mimeTypes: MimeTypeArray, plugins: PluginArray, doNotTrack: "unspecified", maxTouchPoints: 0, mediaCapabilities: MediaCapabilities, oscpu: "Intel Mac OS X 10.13", vendor: "", vendorSub: "", productSub: "20100101" }

在react-native应用内运行导航器将返回一个WorkerNavigator实例。这WorkerNavigator是一项后台任务。

>> navigator
WorkerNavigator { geolocation: Object, hardwareConcurrency: 4, appCodeName: "Mozilla", appName: "Netscape"… }

该WorkerNavigator界面并非与所有浏览器完全兼容/都经过测试，但是我在Iphone X模拟器上测试了功能，并且navigator.geolocation为defined。

关于stackoverflow的几篇文章抱怨Chrome或Safari返回，WorkerNavigator geolocation undefined并在以下答案中进行了解释

是否navigator.geolocation属于navigator在Chrome？

navigator.geolocation属于navigator在main thread只，但不属于navigator中worker thread。

两个导航器在C++侧面具有独立的实现。这就是线程中navigator.geolocation不支持的原因worker。

Chromium包含用于Navigator和WorkerNavigatorC ++实现的单独接口。

Navigator是的属性DOMWindow，WorkerNavigator而是的属性WorkerGlobalScope。

StackOverflow上的用户抱怨chrome webworker没有该geolocation属性

WorkerGlobalScope接口的navigator属性必须返回WorkerNavigator接口的一个实例，该实例代表用户代理（客户端）的身份和状态：

[Exposed=Worker]
interface WorkerNavigator {};
WorkerNavigator includes NavigatorID;
WorkerNavigator includes NavigatorLanguage;
WorkerNavigator includes NavigatorOnLine;
WorkerNavigator includes NavigatorConcurrentHardware;

在geolocation不包括在该方法WorkerNavigation和WorkerLocation接口

将Navigator被初始化为每个工人，可通过WorkerGlobalScope.navigator致电取得的财产window.self.navigator。

如WorkerNavigatorapi文档中所述，它不包含geolocation()方法。

如果您仍然遇到此问题，则可以考虑遵循本指南，手动创建您worker的方法并在不同的浏览器上测试方法。

navigator.permissions? 检测地理位置支持

该WorkerNavigator.permissions只读属性返回一个Permissions可用于的API查询和更新许可状态对象覆盖的权限API。

self.permissions.query({name:'notifications'}).then(function(result) {
  if (result.state === 'granted') {
    showNotification();
  } else if (result.state === 'prompt') {
    requestNotificationPermission()
  }
});

更多信息在这里

解决问题的步骤

1. 您正在console.log使用这些react-native-debugger工具运行，也许输出是从Mac浏览器而不是手机给出的输出。禁止debugging在您的仿真器和展示我们的输出console.warn(navigator)和console.warn(navigator.geolocation)

   appVersion: "5.0 (Macintosh; Intel Mac OS X 10_14_3) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/73.0.3683.103
   Safari/537.36"
   

如下图所示，console.warn(navigator)将在中返回WorkerNavigatorObject react-native-debugger-tools，而{product:"ReactNative", "geolocation": {}}在模拟器中返回Object 。React-native将不会console.log在模拟器内部显示。

2. 您是否仅在Iphone或Android上尝试了此问题？

3. 您是否geolocation在组件顶部错误地导入了对象？

   import { navigator } from ...
   

4. 您是否知道本地地理位置库 提供了更准确的api和更广泛的设备支持？

5. 您的问题似乎与某些不完全支持该WorkerNavigator界面的浏览器有关。您是否在最后一点上有分歧，可以为我们提供一些证明我们错了的证据。React-Native正在使用浏览器api geolocation在后台运行 。您可以按照以下说明在iphone仿真器浏览器中developer console重新创建相同的场景，以创建WorkerNavigator实例，然后获取您的位置。您可以WorkerNavigator在模拟器Safari / Chrome浏览器上演示作品。
6. 您是否考虑过在w3c/geolocation-api存储库中打开问题 ？您是否考虑过打开铬的错误报告？