別のドメインからワーカーを作成する

ワーカーは、JavaScriptでのマルチスレッドの一貫した実装です。 現時点では、十分な数の制限があります。 彼らと知り合うために(workers'amiと制限の両方)、 この記事Antelle habrayuzerから読むことができます。 興味のある人のための主要な情報源へのリンクもあります。





今日、私は別の挑戦に直面する機会がありました。 つまり、別のドメインのjsファイルからワーカーを作成するという問題があります。これは現在、仕様で禁止されています。



物語は、サードパーティのライブラリを使用するChess.com用の小さなGoogle Chrome拡張機能の作成から始まりました。 残念ながら、このライブラリはワーカーとしてのみ機能することが判明しました。



問題は、Chrome自体にページコンテキストからのファイルの取得に関する特定の制限があることです。 ページにサードパーティのJavaScriptコードを導入できますが、それ以上はできません。 そしてこれは、アドオンのコードが実行されたドメインからのみページにワーカーを取得できることを意味します。 つまり、私の場合はChess.comです。 もちろん、いつかChess.comバトルサーバーにアクセスできると期待されますが、今日は動作するようにしたいと思います。 私はそれをググる必要がありました。



幸いなことに、html5rocksの記事は、Blobを介したインラインワーカーの作成という解決策を見つけるのに役立ちました。 詳細はこちら 。 簡単に言えば、任意のテキスト行を作成して、いわゆるBlobに詰め込むことができます。 ペトログリフの描画は 、未加工の外部ファイルのモデルプロトタイプです。



たとえば、次のように(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.
      
      







ここでは、ブラウザビューでは「like-to-file」であるBlobオブジェクトが作成されており、ソーステキストがそこに書き込まれていることがわかります。



しかし、任意のテキストからBlobを作成できる場合、別のサイトから任意のテキストをダウンロードして、それをBlobにプッシュできますか?



では、試してみましょう:

 $.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)); } );
      
      







動作します。 つまり、実際には、ファイルが1つ以上のドメインに属しているかどうかに関係なく、外部ファイルをページにアップロードしてワーカーとして実行できます。 ええ、その日です。



結論として、タイトルのセンセーションにもかかわらず、原則として、このトリックは驚くことではありません。 同じことは、シングルスレッドのJavaScriptコードに対しても実行できます。テキストとしてロードし、evalを介して呼び出します。 この場合、Web WorkersでCORSをサポートするというゆるやかな決定だけが不明確なままです。



All Articles