34

クライアント側のJavaScriptで(ドメインの)Cookieの変更をどうにかして追跡できますか?たとえば、Cookieが変更、削除、または追加された場合に呼び出される関数

優先順に

  • 標準のクロスブラウザ
  • クロスブラウザ
  • ブラウザ固有
  • 拡張機能/プラグイン

なんで?ウィンドウ/タブ#1で依存しているCookieは、ウィンドウ/タブ#2で変更される可能性があるためです。

Chromeを使用すると、Cookieの変更を拡張機能に通知できることがわかりました。しかし、それは私の最も嫌いなオプションです

4

7 に答える 7

25

1 つのオプションは、Cookie の変更を定期的にチェックする関数を作成することです。

var checkCookie = function() {

    var lastCookie = document.cookie; // 'static' memory between function calls

    return function() {

        var currentCookie = document.cookie;

        if (currentCookie != lastCookie) {

            // something useful like parse cookie, run a callback fn, etc.

            lastCookie = currentCookie; // store latest cookie

        }
    };
}();

window.setInterval(checkCookie, 100); // run every 100 ms
  • この例では、永続メモリのクロージャを使用しています。外側の関数がすぐに実行され、内側の関数が返され、プライベート スコープが作成されます。
  • window.setInterval
于 2013-01-15T18:47:08.200 に答える
6

Cookie を操作したコードがあなたのものである場合は localStorage、イベントで変更された追跡に使用できます。たとえば、ジャンクを localStorage に保存して、他のタブでイベントをトリガーできます。

例えば

var checkCookie = function() {

var lastCookies = document.cookie.split( ';' ).map( function( x ) { return x.trim().split( /(=)/ ); } ).reduce( function( a, b ) { 
        a[ b[ 0 ] ] = a[ b[ 0 ] ] ? a[ b[ 0 ] ] + ', ' + b.slice( 2 ).join( '' ) :  
        b.slice( 2 ).join( '' ); return a; }, {} );


return function() {

    var currentCookies =  document.cookie.split( ';' ).map( function( x ) { return x.trim().split( /(=)/ ); } ).reduce( function( a, b ) { 
        a[ b[ 0 ] ] = a[ b[ 0 ] ] ? a[ b[ 0 ] ] + ', ' + b.slice( 2 ).join( '' ) :  
        b.slice( 2 ).join( '' ); return a; }, {} );


    for(cookie in currentCookies) {
        if  ( currentCookies[cookie] != lastCookies[cookie] ) {
            console.log("--------")
            console.log(cookie+"="+lastCookies[cookie])
            console.log(cookie+"="+currentCookies[cookie])
        }

    }
    lastCookies = currentCookies;

};
}();
 $(window).on("storage",checkCookie); // via jQuery. can be used also with VanillaJS


// on the function changed the cookies

document.cookie = ....
window.localStorage["1"] = new Date().getTime(); // this will trigger the "storage" event in the other tabs.
于 2018-05-27T08:22:25.257 に答える
1

少し改善されました (変更された Cookie ごとに console.log を表示します):

var checkCookie = function() {

var lastCookies = document.cookie.split( ';' ).map( function( x ) { return x.trim().split( /(=)/ ); } ).reduce( function( a, b ) { 
        a[ b[ 0 ] ] = a[ b[ 0 ] ] ? a[ b[ 0 ] ] + ', ' + b.slice( 2 ).join( '' ) :  
        b.slice( 2 ).join( '' ); return a; }, {} );


return function() {

    var currentCookies =  document.cookie.split( ';' ).map( function( x ) { return x.trim().split( /(=)/ ); } ).reduce( function( a, b ) { 
        a[ b[ 0 ] ] = a[ b[ 0 ] ] ? a[ b[ 0 ] ] + ', ' + b.slice( 2 ).join( '' ) :  
        b.slice( 2 ).join( '' ); return a; }, {} );


    for(cookie in currentCookies) {
        if  ( currentCookies[cookie] != lastCookies[cookie] ) {
            console.log("--------")
            console.log(cookie+"="+lastCookies[cookie])
            console.log(cookie+"="+currentCookies[cookie])
        }

    }
    lastCookies = currentCookies;

};
}();

window.setInterval(checkCookie, 100);
于 2015-08-21T12:33:57.037 に答える
1

新しい CookieStore を使用し、すべてのブラウザーのサポートが必要な場合は、次のような (投機的な) ポリフィルをインストールできます: https://github.com/markcellus/cookie-store

于 2021-12-08T08:18:32.130 に答える