HTML5 navigator.geolocation in Web Workers

问题:

I am trying to move my code for navigator.geolocation in a web worker.

I tried it with Chrome and Safari but getting 'undefined' on

var isGPSSupported = navigator.geolocation;

Frustrated... they said in specification that 'navigator' object should be supported in web workers...

My code is below:

index.js

var gpsWorker = new Worker("app/gpsworker.js");

gpsWorker.onmessage = function (e) {
    alert(e.data);
};

gpsWorker.postMessage("Start GPS!");

gpsWorker.onerror = function (e) {
    alert("Error in file: " + e.filename + "\nline: " + e.lineno + "\nDescription: " + e.message);
};

gpsworker.js

self.onmessage = function (e) {
    initGeoLoc();
}

function initGeoLoc() {
    if (navigator.geolocation) {
        navigator.geolocation.getCurrentPosition(function (position) {
            self.postMessage("Got position!");
        });
    } else {
        self.postMessage("GPS is not supported on this platform.");
    }
}

Any hint on what is wrong will be greatly appreciated.

回答1:

I had similar question as yours before and asked a related question. Now I believe I have the answer to your question (and also one of my related questions).

navigator.geolocation belongs to navigator in the main thread only, but doesn't belong to navigator in the worker thread.

The main reason is that even though the navigator in worker thread looks exactly the same as the one in main thread, those two navigators have independent implementations on the C++ side. That is why navigator.geolocation is not supported in the worker thread.

The related code is in Navigator.idl and WorkerNavigator.idl in Chromium code. You can see that they are two independent interfaces in the .idl files. And they have independent implementations on the C++ side of the binding. Navigator is an attribute of DOMWindow, while WorkerNavigator is an attribute of WorkerGlobalScope.

However, on the JavaScript side, they have the same name: navigator. Since the two navigators are in two different scopes, there is no name conflict. But when using the APIs in JavaScript, people usually expect similar behavior on both main and worker threads if they have the same name. That's how the ambiguity happens.

回答2:

The 'navigator' object is supported, however it only contains four properties: appName, appVersion, userAgent, and platform.

From looking at your code, it appears you are trying to track the user's location as it changes. You do not have to use web workers to accomplish this. You can simply monitor the user's location on the main thread using watchPosition(), which will automatically notify a callback function whenever the user's location changes:

navigator.geolocation.watchPosition(function(position) {
    document.getElementById('currentLat').innerHTML = position.coords.latitude;
    document.getElementById('currentLon').innerHTML = position.coords.longitude;
});

回答3:

Inspecting it in chrome, it appears it definitely doesn't have the geolocation attribute:

WorkerNavigator
appName: "Netscape"
appVersion: "5.0 (Windows NT 6.1) AppleWebKit/537.1 (KHTML, like Gecko) Chrome/22.0.1207.1 Safari/537.1"
onLine: true
platform: "Win32"
userAgent: "Mozilla/5.0 (Windows NT 6.1) AppleWebKit/537.1 (KHTML, like Gecko)  Chrome/22.0.1207.1 Safari/537.1"
__proto__: WorkerNavigator

In Chrome, you can set a breakpoint in your workers. I'd recommend doing this for your errors, its extremely helpful.

回答4:

Would it not suffice to have the watchPosition(success) in the main-thread postMessage() the new location to your webWorker?