Utilizzo di "API di Google Maps" in un Web Worker

Question

Sto tentando di caricare l'API di Google Maps in un web worker JavaScript, ma non riesce a caricare la libreria di mappe. Il codice Web Worker appare come segue:

importScripts('http://maps.googleapis.com/maps/api/js?libraries=geometry&key=MYAPIKEY&sensor=FALSE'); 

Questo non riesce con un semplice

Script Error. 

in Chrome quando cerco di caricare il Worker.

Suppongo che qualcosa nella libreria delle mappe cerchi di accedere al DOM. Ma quella è solo una congettura. Qualcuno ha una soluzione?

MODIFICA: Ho aperto il collegamento sopra e ho cercato di estrarre + modificare il suo contenuto. Quindi il WebWorker.js ora si presenta così:

var window = {google: {}}; 
var google = {maps: {}}; 
(function() { 

    function getScript(src) { 
     importScripts(src); 
    //document.write('<' + 'script src="' + src + '"><' + '/script>'); 
    } 

    var modules = google.maps.modules = {}; 
    google.maps.__gjsload__ = function(name, text) { 
    modules[name] = text; 
    }; 

    google.maps.Load = function(apiLoad) { 
    delete google.maps.Load; 
    apiLoad([0.009999999776482582,[[["http://mt0.googleapis.com/vt?lyrs=m@306000000\u0026src=api\u0026hl=de-DE\u0026","http://mt1.googleapis.com/vt?lyrs=m@306000000\u0026src=api\u0026hl=de-DE\u0026"],null,null,null,null,"m@306000000",["https://mts0.google.com/vt?lyrs=m@306000000\u0026src=api\u0026hl=de-DE\u0026","https://mts1.google.com/vt?lyrs=m@306000000\u0026src=api\u0026hl=de-DE\u0026"]],[["http://khm0.googleapis.com/kh?v=174\u0026hl=de-DE\u0026","http://khm1.googleapis.com/kh?v=174\u0026hl=de-DE\u0026"],null,null,null,1,"174",["https://khms0.google.com/kh?v=174\u0026hl=de-DE\u0026","https://khms1.google.com/kh?v=174\u0026hl=de-DE\u0026"]],[["http://mt0.googleapis.com/vt?lyrs=h@306000000\u0026src=api\u0026hl=de-DE\u0026","http://mt1.googleapis.com/vt?lyrs=h@306000000\u0026src=api\u0026hl=de-DE\u0026"],null,null,null,null,"h@306000000",["https://mts0.google.com/vt?lyrs=h@306000000\u0026src=api\u0026hl=de-DE\u0026","https://mts1.google.com/vt?lyrs=h@306000000\u0026src=api\u0026hl=de-DE\u0026"]],[["http://mt0.googleapis.com/vt?lyrs=t@132,r@306000000\u0026src=api\u0026hl=de-DE\u0026","http://mt1.googleapis.com/vt?lyrs=t@132,r@306000000\u0026src=api\u0026hl=de-DE\u0026"],null,null,null,null,"t@132,r@306000000",["https://mts0.google.com/vt?lyrs=t@132,r@306000000\u0026src=api\u0026hl=de-DE\u0026","https://mts1.google.com/vt?lyrs=t@132,r@306000000\u0026src=api\u0026hl=de-DE\u0026"]],null,null,[["http://cbk0.googleapis.com/cbk?","http://cbk1.googleapis.com/cbk?"]],[["http://khm0.googleapis.com/kh?v=86\u0026hl=de-DE\u0026","http://khm1.googleapis.com/kh?v=86\u0026hl=de-DE\u0026"],null,null,null,null,"86",["https://khms0.google.com/kh?v=86\u0026hl=de-DE\u0026","https://khms1.google.com/kh?v=86\u0026hl=de-DE\u0026"]],[["http://mt0.googleapis.com/mapslt?hl=de-DE\u0026","http://mt1.googleapis.com/mapslt?hl=de-DE\u0026"]],[["http://mt0.googleapis.com/mapslt/ft?hl=de-DE\u0026","http://mt1.googleapis.com/mapslt/ft?hl=de-DE\u0026"]],[["http://mt0.googleapis.com/vt?hl=de-DE\u0026","http://mt1.googleapis.com/vt?hl=de-DE\u0026"]],[["http://mt0.googleapis.com/mapslt/loom?hl=de-DE\u0026","http://mt1.googleapis.com/mapslt/loom?hl=de-DE\u0026"]],[["https://mts0.googleapis.com/mapslt?hl=de-DE\u0026","https://mts1.googleapis.com/mapslt?hl=de-DE\u0026"]],[["https://mts0.googleapis.com/mapslt/ft?hl=de-DE\u0026","https://mts1.googleapis.com/mapslt/ft?hl=de-DE\u0026"]],[["https://mts0.googleapis.com/mapslt/loom?hl=de-DE\u0026","https://mts1.googleapis.com/mapslt/loom?hl=de-DE\u0026"]]],["de-DE","US",null,0,null,null,"http://maps.gstatic.com/mapfiles/","http://csi.gstatic.com","https://maps.googleapis.com","http://maps.googleapis.com",null,"https://maps.google.com","https://gg.google.com","http://maps.gstatic.com/maps-api-v3/api/images/","https://www.google.com/maps",0],["http://maps.gstatic.com/maps-api-v3/api/js/21/3/intl/de_ALL","3.21.3"],[141790386],1,null,null,null,null,null,"",["geometry"],null,0,"http://khm.googleapis.com/mz?v=174\u0026","AIzaSyDQi59vEjsIzBM-AFMeDbszVsOckQOb5A8","https://earthbuilder.googleapis.com","https://earthbuilder.googleapis.com",null,"http://mt.googleapis.com/vt/icon",[["http://mt0.googleapis.com/vt","http://mt1.googleapis.com/vt"],["https://mts0.googleapis.com/vt","https://mts1.googleapis.com/vt"],null,null,null,null,null,null,null,null,null,null,["https://mts0.google.com/vt","https://mts1.google.com/vt"],"/maps/vt",306000000,132],2,500,[null,"http://g0.gstatic.com/landmark/tour","http://g0.gstatic.com/landmark/config",null,"http://www.google.com/maps/preview/log204","","http://static.panoramio.com.storage.googleapis.com/photos/",["http://geo0.ggpht.com/cbk","http://geo1.ggpht.com/cbk","http://geo2.ggpht.com/cbk","http://geo3.ggpht.com/cbk"]],["https://www.google.com/maps/api/js/master?pb=!1m2!1u21!2s3!2sde-DE!3sUS!4s21/3/intl/de_ALL","https://www.google.com/maps/api/js/widget?pb=!1m2!1u21!2s3!2sde-DE"],null,0,0,"/maps/api/js/ApplicationService.GetEntityDetails",0], loadScriptTime); 
    }; 

    importScripts(
    'http://maps.gstatic.com/maps-api-v3/api/js/21/3/intl/de_ALL/main.js' 
    , 'http://maps.gstatic.com/maps-api-v3/api/js/21/3/intl/de_ALL/geometry.js' 
    ); 

})(); 

Ma questo risulta ancora in un 'errore Script'.

Answer 1

Api client di Google come la mappa, l'unità ecc. Ha bisogno dell'elemento dom in modo che non sia possibile utilizzare map api in web worker. Ho anche avuto un problema simile in passato dopo ore di ricerca ho confermato che non può essere fatto almeno non in questo momento. Ci sono poche cose che devi sapere sul web wroker.

ci sono pochissimi oggetti che possiamo avere accesso a lavoratori web:

XMLHttpRequest, JSON, Lavoro, navigatore, ubicazione, e Timeout chiaro, script di importazione, impostare ed eliminare l'intervallo.

La finestra o gli oggetti parent, localStorage non sono accessibili da un web worker.

per ulteriori dettagli è possibile controllare il collegamento this.

Answer 2

Sono stato in grado di creare un'istanza di un indicatore ingannando l'operatore nel pensare che esistesse un oggetto DOM da utilizzare. Ho rubato l'idea alle persone che tentavano di usare i comandi jQuery all'interno dei lavoratori che incontrano lo stesso problema. Il mio riferimento era da qui:

// create a fake document for jQuery to function - DOES NOT PROVIDE ACCESS TO ACTUAL DOM ELEMENTS 
// from Tomáš Zato comment on http://stackoverflow.com/questions/10491448/how-to-access-jquery-in-html-5-web-worker 
var document = self.document = {parentNode: null, nodeType: 9, toString:function() {return "FakeDocument"}}; 
var window = self.window = self; 
var fakeElement = Object.create(document); 
fakeElement.nodeType = 1; 
fakeElement.toString=function() {return "FakeElement"}; 
fakeElement.parentNode = fakeElement.firstChild = fakeElement.lastChild = fakeElement; 
fakeElement.ownerDocument = document; 

document.head = document.body = fakeElement; 
document.ownerDocument = document.documentElement = document; 
document.getElementById = document.createElement = function() {return fakeElement;}; 
document.createDocumentFragment = function() {return this;}; 
document.getElementsByTagName = document.getElementsByClassName = function() {return [fakeElement];}; 
document.getAttribute = document.setAttribute = document.removeChild = 
    document.addEventListener = document.removeEventListener = 
    function() {return null;}; 
document.cloneNode = document.appendChild = function() {return this;}; 
document.appendChild = function(child) {return child;};