Erstellen Sie einen Worker aus einer anderen Domäne

    Worker sind eine kohärente Implementierung von Multithreading in JavaScript. Im Moment haben sie eine ausreichende Anzahl von Einschränkungen. Für die Bekanntschaft mit ihnen (sowohl Arbeiter, als auch Einschränkungen) ist es möglich, diesen Artikel von Antelle Habrayuzer zu lesen . Es gibt auch Links zu den wichtigsten Informationsquellen für Interessierte.


    Heute hatte ich die Chance, mich einer weiteren Herausforderung zu stellen. Nämlich mit dem Problem, einen Worker aus einer js-Datei einer anderen Domain zu erstellen, was derzeit durch deren Spezifikation verboten ist.

    Die Geschichte begann mit der Erstellung einer kleinen Google Chrome-Erweiterung für Chess.com, die eine Drittanbieter-Bibliothek verwendete. Leider stellte sich heraus, dass diese Bibliothek nur als Arbeiter arbeitet.

    Das Problem ist, dass Chrome selbst bestimmte Einschränkungen beim Abrufen von Dateien aus dem Seitenkontext hat. Es ermöglicht die Einführung von Javascript-Code von Drittanbietern auf der Seite, mehr jedoch nicht. Dies bedeutet, dass der Code des Add-Ons Worker nur von der Domäne auf die Seite bringen kann, auf der es ausgeführt wurde. Das heißt in meinem Fall: Chess.com. Natürlich würde man erwarten, dass ich eines Tages Zugang zu den Kampfservern von Chess.com bekomme, aber ich möchte, dass es heute funktioniert. Ich musste es googeln.

    Glücklicherweise hat der Artikel zu html5rocks bei der Suche nach einer Lösung geholfen: Erstellen eines Inline-Workers über Blob. Details hier . Kurz gesagt, Sie können einen beliebigen Textstring erstellen und ihn in die sogenannte Blob- Rock-Art packenModellprototyp einer externen Rohdatei.

    Zum Beispiel so (entnommen aus html5rocks):
    var blob = new Blob([
        "onmessage = function(e) { postMessage('msg from worker'); }"]);
    // Obtain a blob URL reference to our worker 'file'.
    var blobURL = window.URL.createObjectURL(blob);
    var worker = new Worker(blobURL);
    worker.onmessage = function(e) {
      // e.data == 'msg from worker'
    };
    worker.postMessage(); // Start the worker.
    


    Hier sehen wir, dass ein Blob-Objekt erstellt wird, das in der Browser-Ansicht ein "Like-to-File" ist, in das der Quelltext geschrieben wird.

    Aber wenn wir Blob aus irgendeinem Text erstellen können, können Sie dann irgendeinen Text von einer anderen Site herunterladen und ihn dann in Blob pushen?

    Ok, lass es uns versuchen:
    $.get("https://example.com/js/worker.js", {},
         function (workerCode) {
             var blob = new Blob([workerCode], {type : 'javascript/worker'});
             var worker = new Worker(window.URL.createObjectURL(blob));
         }
    );
    


    Es funktioniert Das heißt, wir können jede externe Datei auf die Seite hochladen und als Worker ausführen, unabhängig davon, ob die Dateien zu einer oder mehreren Domänen gehören. Ja, das ist der Tag.

    Abschließend stelle ich fest, dass dieser Trick trotz der Sensation des Titels im Prinzip nicht überraschend ist. Dasselbe gilt für Single-Threaded-Javascript-Code: Laden Sie ihn als Text und rufen Sie ihn über eval auf. In diesem Fall bleibt nur eine gemächliche Entscheidung unklar, CORS in Web Workers zu unterstützen.

    Jetzt auch beliebt: