1. ホーム
  2. ジャバスクリプト

[解決済み] 独立したJavascriptファイルを持たないWebワーカー?

2022-03-26 12:30:36

質問

私の知る限り、ウェブ ワーカーは別の JavaScript ファイルに記述して、次のように呼び出す必要があります。

new Worker('longrunning.js')

クロージャコンパイラを使って、すべてのJavaScriptソースコードを結合してミニマイズしているのですが、ワーカーを別々のファイルにして配布するのは避けたいのです。これを実現する方法はありますか?

new Worker(function() {
    //Long-running work here
});

ファーストクラス関数がJavaScriptにとって非常に重要であることを考えると、バックグラウンドワークを行う標準的な方法は、なぜウェブサーバーからまったく別のJavaScriptファイルをロードする必要があるのでしょうか?

どうすれば解決するの?

http://www.html5rocks.com/en/tutorials/workers/basics/#toc-inlineworkers

ワーカー スクリプトをその場で作成したり、ワーカー ファイルを個別に作成せずに自己完結型のページを作成したりしたい場合はどうすればよいでしょうか。Blob() を使用すると、ワーカー コードへの URL ハンドルを文字列として作成することにより、メイン ロジックと同じ HTML ファイルにワーカーを "inline"することができます。



BLOBインラインワーカーの完全な例。

<!DOCTYPE html>
<script id="worker1" type="javascript/worker">
  // This script won't be parsed by JS engines because its type is javascript/worker.
  self.onmessage = function(e) {
    self.postMessage('msg from worker');
  };
  // Rest of your worker code goes here.
</script>
<script>
  var blob = new Blob([
    document.querySelector('#worker1').textContent
  ], { type: "text/javascript" })

  // Note: window.webkitURL.createObjectURL() in Chrome 10+.
  var worker = new Worker(window.URL.createObjectURL(blob));
  worker.onmessage = function(e) {
    console.log("Received: " + e.data);
  }
  worker.postMessage("hello"); // Start the worker.
</script>