用户离开页面时不保留cookie

User does not keep cookie when they leave the page

我正在使用 jscookie 在触发弹出窗口后为用户分配一个 cookie,以确保他们在 7 天内不会再次看到它。我的代码如下。

该函数在两个页面上都查找弹出式 cookie。如果 cookie 不存在,则会触发弹出窗口并分配 cookie。这两个功能都可以正常工作。

这是问题所在:

如果用户访问 page A,弹出窗口将被触发,他们将被分配 cookie。然后,如果用户转到 page B 他们仍然有 cookie,并且不会触发弹出窗口。

但是,如果用户首先访问 page B,将触发弹出窗口并分配 cookie。 但是 如果用户随后转到 page A cookie 将不再出现在 cookie 列表中。 page A 将触发弹出窗口并分配 cookie。

这是踢球者。如果我回到页面 B,我会看到我有两个完全相同的 cookie。唯一的区别是 path。一个 popup_cookie 来自页面 A,另一个来自页面 B.

示例:

Name          Value  Domain        Path
popup_cookie  true   mydomain.com  /page-a
popup_cookie  true   mydomain.com  /page-b

问题:

那么为什么用户在从 page Apage B 时保留了 cookie,而不是从 page Bpage A?正如您在下面看到的,cookie 在两种情况下都以相同的方式分配。

////Page A Popup

// Checks for popup cookie
if (Cookies.get('popup_cookie') == 'true') {
    // Do nothing
} else if ($('#form').length) { 
    $('#form').appendTo('#page-a-popup-container');
    $('body').on('mouseleave',function () {
        if ($('#other-element').hasClass('visible')) {
            // Do nothing
        } else {
            $('#page-a-popup-container').css('display', 'grid');
            $('#popup-bg').fadeIn();
            Cookies.set('popup_cookie', true, {expires: 7, path: ''});
            $('body').off('mouseleave');
        }
    });
    // Pop-up Close Button
    $('#page-a-popup-close').click(function () {
        $('#page-a-popup-container').hide();
        $('#popup-bg').hide();
    });
}

//// Page B Popup

// Checks for popup cookie
if (Cookies.get('popup_cookie') == 'true') {
    // Do nothing
} else if ($('#form').length) {
    $('#form').appendTo('#plan-b-popup-container');
    $('body').on('mouseleave',function () {
        if ($('#drip-header-119587').hasClass('drip-hidden')) {
            // Do nothing
        } else {
            $('#plan-b-popup-container').css('display', 'grid');
            $('#popup-bg').fadeIn();
            Cookies.set('popup_cookie', true, {expires: 7, path: ''});
            $('body').off('mouseleave');
        }
    });
    // Pop-up Close Button
    $('#plan-b-popup-close').click(function () {
        $('#plan-b-popup-container').hide();
        $('#popup-bg').hide();
    });
}

该死的。当然,在我花了这么多时间在这个 post 上之后,我马上就弄明白了 :(

我所要做的就是在两个函数中将 cookie 的路径设置为 path: '/'。这样,在内部页面上分配的 cookie 就会保留在每个页面上。

显然路径决定了 cookie 的活动位置。