最新の HTML BroadcastChannel API 推奨_html/css_WEB-ITnose

HTML BroadcastChannel API

現在のブラウザの中で、BroadcastChannel APIをサポートしているのはFirefox38のみであり（記事執筆時点）、Firefox38は2015年5月まで正式版をリリースしないことが公式に発表されています。この新しい API は、新たな可能性の世界を開き、postMessage API から引き継いだ多くの制限を解決します。

WHATWG リビング HTML 標準の一部としての BroadcastChannel API については、ここで詳細を確認できます。

BroadcastChannel API とは何ですか?

BroadcastChannel API を使用すると、同じオリジン ドメインおよびユーザー エージェントにあるすべてのウィンドウ、iFrame などが対話できるようになります。つまり、ユーザーが同じ Web サイトの 2 つのタブ ウィンドウを開いた場合、Web サイトのコンテンツが変更された場合、両方のウィンドウに更新が同時に通知されます。

まだわからないですか？ Facebook を例に挙げると、Facebook ウィンドウを開いてまだログインしておらず、ログインするために別のウィンドウを開いた場合、ユーザーがログインしてリクエストを行ったことを他のウィンドウ/タブに通知できます。対応するページの更新。

本質的に、BroadcastChannel API を使用すると、ソケットやタイマーを使用せずに状態変化を自己認識できるアプリケーションを構築できます。これは、パブリッシュ/サブスクライブ システムに特に効果的です。

BroadcastChannel API の動作

新しい BroadcastChannel の作成

新しい BroadcastChannel API の作成は簡単です。必要なのは、チャンネル名をパラメーターとして BroadcastChannel コンストラクターに渡し、その参照を変数に保存することだけです。

let cast = new BroadcastChannel('mychannel');

メッセージ通知を送信する

メッセージの送信も非常に簡単です。必要なのは、BroadcastChannel インスタンスに割り当てられた変数 (この例では、上記のキャスト変数です) を参照し、その postMessage メソッドを呼び出すことだけです。

他のパブリッシュ/サブスクライブ ベースのシステムに精通している場合は、postMessage メンバー メソッドをイベント エミッターと呼ぶ方が合理的かもしれません。

postMessage メソッドの優れている点は、これを使用してあらゆるものを送信できることです。オブジェクトや文字列など、何でも送信できます。あなたが送信しているイベントを購読者が知っている限り、それを楽しんでください。

myObj = {someKey: 'Some value', anotherKey: 'Another value'};cast.postMessage(myObj);

一部のよりニッチなパブリッシュ/サブスクライブ システムとは異なり、「トピック」はネイティブ実装ではサポートされていません。これは、すべてのリスニング加入者に「トピック」をブロードキャストするチャネルがないことを意味します。

ただし、創造的なコードを作成することで、この実装を模倣することもできます。オブジェクトを使用して、オブジェクトの 1 つのキーとして「トピック」を送信し、別のキー「データ」としてメッセージのコンテンツを送信することができます。

メッセージ監視

「受信者」は、「サブスクライバー」と呼ばれることの方が一般的です。受信機は、特定のチャネルに対して前に定義した BroadcastChannel チャネル参照変数によって発行されたイベントをリッスンします。

cast.onmessage = function (e) {     console.log(e); // This should print out the contents of the object we sent above}

接続を閉じます

Javascript のパフォーマンスを非常に重視し、リソース消費 (特に携帯電話を使用する場合) を気にしていると仮定します。 幸いなことに、BroadcastChannel には、これらの接続を閉じることができる組み込みメソッドがあります。

cast.close(); // Close our connection and let the garbage collection free up the memory that was used

ブラウザのサポート

前に述べたように、現時点では Firefox バージョン 38 のみが BroadcastChannel API をサポートします。他のブラウザも追随する可能性が高いと考えると、やはりこの API は非常に便利です。そうなると、この分野で通常のアプリケーションやゲーム アプリケーションを作成するのは、水の中のアヒルのようなものになります (厳しいブラウザ サポートの出現)

ユーザーの観点から見ると、(現時点では) 基本的には優れている、または関連するテクニカルサポートではありません。ただし、現在は BroadcastChannel API を使用できるブラウザ プラグインがありますが、結局のところ、この機能のサポートを実際に実装しているブラウザはまだないため、様子見するしかありません。

原文: http://ilikekillnerds.com/2015/03/all-about-the-html-broadcastchannel-api/

著者: 天地匯珠海支店

WeChat 公開アカウント: TechGoGoGo
Weibo: http://weibo .com/techgogogo
CSDN：