51

ブラウザ内で自分がどのタブにいるのかを識別できる必要があります。タブを識別するためにブラウザーから取得できる情報はありませんか? 他のタブについて何も知る必要はありません。自分がいるタブの ID が必要なだけです。タブの寿命。

リモートサーバーへの HTTP 接続を介して BOSH を作成するクライアント側アプリがあり、それを複数のタブで開くと、各インスタンスに独自の一意の ID が必要になるか、アプリが失敗するため、関連付けられている一意の番号が必要です。そのタブが存在する限り、タブ (つまり、このアプリを提供するサイトをナビゲートするときにページを更新しても存続するもの)。window.tabId のように、ブラウザーで使用できるようにする必要があるのは簡単なことのように思えます - それだけで十分です。存在しないように見えるこの単純な、単純な、単純なソリューションを乗り越えることができないため、深刻な開発ブロックがあります。方法があるに違いありません (クロスブラウザー ソリューション)。

何か案は？

4

10 に答える 10

51

SessionStorage はタブ/ウィンドウごとであるため、sessionStorage で乱数を定義し、存在する場合は最初にそれを取得できます。

var tabID = sessionStorage.tabID ? 
            sessionStorage.tabID : 
            sessionStorage.tabID = Math.random();

更新:
場合によっては、複数のタブに同じ sessionStorage がある場合があります (たとえば、タブを複製する場合)。その場合、次のコードが役立つ場合があります。

var tabID = sessionStorage.tabID && 
            sessionStorage.closedLastTab !== '2' ? 
            sessionStorage.tabID : 
            sessionStorage.tabID = Math.random();
sessionStorage.closedLastTab = '2';
$(window).on('unload beforeunload', function() {
      sessionStorage.closedLastTab = '1';
});
于 2016-04-23T07:14:01.393 に答える
15

html5 を使用する必要がありますが、ランダムな GUID と組み合わせたsessionStorageが必要なようです。

于 2012-08-10T06:39:05.340 に答える
6

JavaScriptでタブIDを取得することはできませんが、ユーザーが新しいタブを開いたときに別のセッション/ Cookieを使用するなど、役立つ解決策があります。

いくつかの参照：

ブラウザのタブ インデックス/ID を取得する

Firefox 拡張機能から Firefox タブの URL を取得する

ブラウザタブでセッションを区別する方法は?

各ブラウザ タブで一意のセッションを取得する

asp.net - セッション - 複数のブラウザ タブ - 異なるセッション?

于 2012-08-10T06:00:23.097 に答える
3

ここで React を使っている人のために、こっそりと小さなフックを作りました。

import {useEffect, useMemo} from 'react'
import uniqid from 'uniqid'

export const TAB_ID_KEY = 'tabId'

export default () => {
  const id = useMemo(uniqid, [])

  useEffect(() => {
    if (typeof Storage !== 'undefined') {
      sessionStorage.setItem(TAB_ID_KEY, id)
    }
  }, [id])

  return id
}

これをベースのアプリ/ページ コンポーネント、または常にマウントされることがわかっている場所に配置します。

マウント後に効果を実行し、タブに固有のストレージであるセッション ストレージに現在のタブの一意の ID を設定します。

タブを複製すると、新しいタブの新しい ID が取得されます。これは、コンポーネントが再びマウントされ、効果が実行され、前のタブの ID が上書きされるためです。

于 2019-07-24T22:14:40.830 に答える
2

考えられる解決策の1つは、「window.name」プロパティを使用することですが、他の誰かが使用できるため、使用したくありません。

もう1つの可能な解決策を見つけました：sessionStorageを使用します。FF3.5 +、Chrome4 +、Safari4 +、Opera10.5 +、およびIE8+でサポートされています。

于 2012-09-18T14:17:20.900 に答える