HTML5でJavaScript共有Webワーカーの使用方法-jsチュートリアル-php.cn

How to Use JavaScript Shared Web Workers in HTML5

HTML5でJavaScript共有Webワーカーの使用方法

私たちは最近、JavaScriptのWebワーカーについて話し合いました「専用の」品種を参照して。まだ読んでいない場合は、最初にそれを行うことをお勧めします。この記事は同じ概念に基づいています。一言で言えば、

Webワーカー

Webワーカーは、別のスレッドのバックグラウンドでロードおよび実行された単一のJavaScriptファイルです。専用のWebワーカーは、作成者（ワーカーをロードしたスクリプト）にリンクされています。共有Webワーカーにより、任意の数のスクリプトが単一のワーカーと通信することができます。共有Webワーカーは、専用のカウンターパートと同じルールを順守しています。DOM、ドキュメント、ページのスクリプトアクセスなし、ほとんどのウィンドウプロパティへの読み取り専用許可。さらに、ページスクリプトは、同じOrigin/Domain（Somesite.com）の共有Webワーカーとのみ通信できます。現在、共有WebワーカーはChrome、Safari、Operaでサポートされています。 Firefox 4とIE9サポートが到着する可能性がありますが、賭けないでください。共有労働者はリソースを節約するかもしれませんが、彼らは余分なレベルの複雑さを追加します。いくつかの問題を期待してください。

DOM2イベント（AddEventListener）ハンドラーは、最も信頼できる実装のようです。

共有Webワーカーを作成するには、JavaScriptファイル名を共有ワーカーオブジェクトの新しいインスタンスに渡します。

共有Webワーカーとの通信

var worker = new SharedWorker("jsworker.js");

ログイン後にコピー

ページスクリプトは、共有Webワーカーと通信できます。専用のWebワーカーとは異なり、「ポート」オブジェクトを介して通信し、メッセージイベントハンドラーを添付する必要があります。さらに、ポートのstart（）を呼び出す必要があります最初のpostmessage（）を使用する前の方法： pagescript.js：

Webワーカースクリプトがスクリプトから最初のメッセージを受信する場合、イベントハンドラーをアクティブポートに添付する必要があります。ほとんどの場合、ハンドラーは独自のPostMessage（）メソッドを実行して、呼び出しコードにメッセージを返します。最後に、メッセージングを有効にするには、ポートのstart（）メソッドも実行する必要があります。 jsworker.js：

彼らの献身的な兄弟のように、共有されたウェブワーカーは次のとおりです。

var worker = new SharedWorker("jsworker.js");

worker.port.addEventListener("message", function(e) {
	alert(e.data);
}, false);

worker.port.start();

// post a message to the shared web worker
worker.port.postMessage("Alyssa");

ログイン後にコピー

var connections = 0; // count active connections

self.addEventListener("connect", function (e) {

	var port = e.ports[0];
	connections++;

	port.addEventListener("message", function (e) {
		port.postMessage("Hello " + e.data + " (port #" + connections + ")");
	}, false);

	port.start();

}, false);

ログイン後にコピー

intortscripts（）

エラーハンドラーを添付し、
特定のポートでのさらなる通信を防ぐために、port.close（）メソッドを実行します。

共有されたWebワーカーは、おそらく数年間実行可能なテクノロジーではないでしょうが、JavaScript開発の将来のためのエキサイティングな機会を高めています。ブラウザベンダーがいくつかのまともなトレースとデバッグツールを提供できることを願っています！ JavaScriptが共有されたWebワーカーについてよく尋ねられる質問（FAQ）

JavaScriptの共有労働者とWeb労働者の主な違いは何ですか？

JavaScriptの共有労働者とWeb労働者はどちらもマルチスレッドを可能にしますが、範囲と使用法が異なります。 Webワーカーは、作成されたタブの範囲に限定されます。他のタブやWindowsと通信することはできません。一方、共有ワーカーは、同じドメインにある限り、異なるタブ、Windows、またはIFRAMEで実行されている複数のスクリプトからもアクセスできます。これにより、共有ワーカーは、さまざまなブラウザーコンテキスト間のデータ共有と通信を必要とするタスクに最適になります。簡単な例を次に示します。

var mysharedworker = new sharedworker（ 'worker.js'）;

この例では、「worker.js」は共有ワーカーが実行するスクリプトです。スクリプトは、同じオリジンの政策制限のために共有ワーカーを作成するスクリプトと同じドメインにある必要があることに注意することが重要です。ポストメサージメソッドは、共有ワーカーにメッセージを送信するために使用されますが、オンメセージイベントハンドラーはメッセージを受信するために使用されます。例は次のとおりです。

//共有労働者にメッセージを送信します
mysharedworker.port.postmessage（ 'hello、worker！'）;

//共有労働者からメッセージを受け取る

mysharedworker.port.onmessage = function（e）{

console. e.data）;

};

共有労働者は、異なるブラウザタブ間でデータを共有できますか？これは、同じドメインのすべてのスクリプトが同じ共有ワーカーインスタンスにアクセスできるため、可能です。これにより、共有労働者は、共同編集アプリやマルチタブゲームなど、複数のタブやウィンドウにわたるリアルタイムの更新が必要なタスクに最適です。ただし、インターネットエクスプローラーではサポートされていません。使用できますか？

共有労働者のエラーを処理するにはどうすればよいですか？

共有労働者には、実行中に発生するエラーをキャッチおよび処理するために使用できる「Onerror」イベントハンドラーがあります。例は次のとおりです。

mysharedworker.onerror = function（e）{
console.log（ 'エラーが発生しました：' e.message）;
};