Можно определить, есть ли у пользователя несколько открытых вкладок вашего сайта?

Я просто думаю обо всем процессе регистрации сайта.

пользователь заходит на ваш сайт, регистрируется, а затем вы говорите ему, что вы отправили ему электронное письмо, и он должен подтвердить свой адрес электронной почты. Итак, он бьет Ctrl+T, открывает новую вкладку, нажимает его Gmail кнопка fav, не читает ни слова вашего длинного приветственного письма, но нажимает первую ссылку, которую он видит. Gmail открывает ваш сайт на еще одной вкладке...

ему не нужны и не нужны две вкладки если ваш сайт открыт, он просто хочет просмотреть эту проклятую страницу, доступ к которой вы ему запретили, пока он не зарегистрируется.

Так что же нам делать? Я видел один сайт (но я забыл, что это было), который сделал действительно хорошую работу, и он фактически обновил первую вкладку, которую я открыл, без необходимости нажимать что-либо.

Я думаю, было бы неплохо, если бы мы могли обнаружить, если у пользователя уже есть вкладка на ваш сайт, мы могли бы либо закрыть новую вкладку проверки автоматически, либо сказать ему, что он может закройте его, чтобы вернуться на другую вкладку (которую мы теперь обновили и вошли в систему).

или, может быть, когда он получил ваше раздражающее сообщение "пожалуйста, проверьте свою электронную почту", он пошел прямо на свою электронную почту, заменив ваш сайт своей электронной почтой, прекрасно зная, что электронная почта снова свяжет его с сайтом. В таком случае, мы не хотим закрывать вкладку, но, возможно, могли бы сохранить его местоположение раньше и перенаправить его туда снова?

в любом случае, это просто вариант использования... этот вопрос все еще стоит. можем ли мы определить, если пользователь уже имеет вкладку на ваш сайт открыт?

этот вопрос не о том, как обнаружить , когда пользователь завершил процесс регистрации. AJAX polling или comet могут решить эту проблему. Я специально хочу знать, есть ли у пользователя уже открытая вкладка на вашем сайте или нет.

30
browser javascript tabs user-experience

6 ответов

Я довольно поздно на вечеринку здесь (более года), но я не мог не заметить, что вы пропустили невероятно простое и элегантное решение (и, вероятно, то, что вы видели на этом веб-сайте).

используя JavaScript, вы можете изменить имя окна, которое вы в настоящее время открыли через:

window.name = "myWindow";

затем, когда вы отправляете письмо с подтверждением, просто сделайте (предполагая, что вы отправляете HTML-письмо):

<a href="verificationlink.php" target="myWindow">Verify</a>

что должно привести к verificationLink открытие внутри окна ваш сайт уже загружен, если он уже закрыт, откроется новая вкладка с указанным именем окна.

37

вы можете отправить запрос AJAX каждый X секунды от исходной вкладки, которая запрашивает сервер, получил ли он запрос от электронной почты.

вы не можете закрыть вторую вкладку автоматически, но вы можете попросить сервер после 3X секунд, слышал ли он с первой вкладки.

6

вы можете остановить функциональность страницы, когда пользователь открыл другую вкладку или другое окно или даже другой браузер

$(window).blur(function(){
    // code to stop functioning or close the page  
});
6

то, что у меня здесь, немного отличается от вашего варианта использования, но он определяет, доступен ли сайт на другой вкладке. В этом случае я хотел ограничить людей, использующих некоторые страницы центра обработки вызовов, только одной вкладкой. Он работает хорошо и является чисто клиентской стороной.

// helper function to set cookies
function setCookie(cname, cvalue, seconds) {
    var d = new Date();
    d.setTime(d.getTime() + (seconds * 1000));
    var expires = "expires="+ d.toUTCString();
    document.cookie = cname + "=" + cvalue + ";" + expires + ";path=/";
}

// helper function to get a cookie
function getCookie(cname) {
    var name = cname + "=";
    var decodedCookie = decodeURIComponent(document.cookie);
    var ca = decodedCookie.split(';');
    for(var i = 0; i < ca.length; i++) {
        var c = ca[i];
        while (c.charAt(0) == ' ') {
            c = c.substring(1);
        }
        if (c.indexOf(name) == 0) {
            return c.substring(name.length, c.length);
        }
    }
    return "";
}

// Do not allow multiple call center tabs
if (~window.location.hash.indexOf('#admin/callcenter')) {
    $(window).on('beforeunload onbeforeunload', function(){
        document.cookie = 'ic_window_id=; expires=Thu, 01 Jan 1970 00:00:00 UTC; path=/;';
    });

    function validateCallCenterTab() {
        var win_id_cookie_duration = 10; // in seconds

        if (!window.name) {
            window.name = Math.random().toString();
        }

        if (!getCookie('ic_window_id') || window.name === getCookie('ic_window_id')) {
            // This means they are using just one tab. Set/clobber the cookie to prolong the tab's validity.
            setCookie('ic_window_id', window.name, win_id_cookie_duration);
        } else if (getCookie('ic_window_id') !== window.name) {
            // this means another browser tab is open, alert them to close the tabs until there is only one remaining
            var message = 'You cannot have this website open in multiple tabs. ' +
                'Please close them until there is only one remaining. Thanks!';
            $('html').html(message);
            clearInterval(callCenterInterval);
            throw 'Multiple call center tabs error. Program terminating.';
        }
    }

    callCenterInterval = setInterval(validateCallCenterTab, 3000);
}
3

у пользователя все равно будет сеанс на сервере. Почему бы не сохранить местоположение пользователя до регистрации, и когда они подтверждают свою регистрацию, прочитайте местоположение обратно из сеанса и перенаправить обратно на эту страницу. Не требуется закладка магии. Это, конечно, не то, что я ожидал бы от процесса регистрации.

2

добавить к другим ответам: Вы также можете использовать localStorage. Имейте запись, такую как "openedTabs". При открытии страницы увеличьте это число. Когда пользователь покидает страницу, уменьшите ее.

1