同時に2つの異なるブラウザウィンドウ/タブで実行されているWebアプリケーションがあります(それらをaとbと呼びましょう)。問題は、ウィンドウ b のコンテンツの更新でタブ a のクリックに反応する必要があることです。変更はすぐに行われる必要があります。
どんな提案でも大歓迎です。ありがとう。
同時に2つの異なるブラウザウィンドウ/タブで実行されているWebアプリケーションがあります(それらをaとbと呼びましょう)。問題は、ウィンドウ b のコンテンツの更新でタブ a のクリックに反応する必要があることです。変更はすぐに行われる必要があります。
どんな提案でも大歓迎です。ありがとう。
ブラウザのタブ/ウィンドウ間の直接通信は、ウィンドウの 1 つが を使用して他のウィンドウによって開かれている場合にのみ機能しますwindow.open
。アプリケーションがこれに該当する場合は、次のようなことを行うことができます (インスタント双方向通信)。これは非常に基本的な例にすぎませんが、ニーズに合わせて拡張できると確信しています。
ウィンドウ A:
var windowB = window.open("windowB.html"); //reference to window B
windowB.onload = function(){
windowB.triggerChange();
};
function changeOK(str) {
console.log("windowA: "+str);
}
ウィンドウ B:
var windowA = window.opener; //reference to window A
function triggerChange() {
console.log("windowB: triggerChange");
windowA.changeOK("change done");
}
これを試す前に、ポップアップ ブロッカーを無効にすることを忘れないでください。;)
ただし、ウィンドウ A とウィンドウ B を別々に開くと、このように直接通信を使用することはできません。次に、基本的に、必要なことを達成するための2つのオプションがあります(SO で説明されています):
Cookie を使用する: ウィンドウ A に Cookie を設定してデータを渡しsetTimeout
、ウィンドウ B を使用して定期的に Cookie を読み取り、変更に対応します。この例を参照してください。
AJAX とロング ポーリングを使用してサーバーと通信します (コメット手法)。
どちらのソリューションも間接通信を使用するため、ウィンドウ B で即座に変更をトリガーできないことは明らかです。したがって、B のコンテンツが更新されるまで、少なくとも数ミリ秒待つ必要があります。