¿Es posible detectar si un usuario tiene varias pestañas abiertas en su sitio?

Question

Estoy pensando en todo el proceso de registro del sitio.

Un usuario va a su sitio, se registra y luego le dice que le ha enviado un correo electrónico y que necesita verificar su dirección de correo electrónico. Entonces él golpea Ctrl + T, abre una nueva pestaña, toca su botón fav Gmail, no lee ni una palabra de su extenso correo electrónico de bienvenida, pero hace clic en el primer enlace que ve. Gmail abre su sitio en otra pestaña ...

No necesita ni quiere tener abiertas dos pestañas para su sitio, solo quiere ver esa maldita página a la que le ha prohibido acceder hasta que se registre.

Entonces, ¿qué hacemos? Vi un sitio (pero olvidé lo que era) que hizo un muy buen trabajo, y realmente refrescó la primera pestaña que tenía abierta sin tener que presionar nada.

Estoy pensando, podría ser bueno si podemos detectar si el usuario ya tiene una pestaña abierta en su sitio, podríamos cerrar la nueva pestaña de verificación automáticamente, o decirle que puede cerrarla, puede volver atrás a su otra pestaña (que ahora hemos actualizado y lo registramos).

O tal vez cuando recibió su molesto mensaje "por favor revise su correo electrónico", fue directamente a su correo electrónico, reemplazando su sitio con su correo electrónico sabiendo muy bien que el correo electrónico lo vinculará de nuevo al sitio. En ese caso, no queremos cerrar la pestaña, pero ¿podría haber guardado su ubicación desde antes y redirigirlo de nuevo?

De todos modos, ese es el caso de uso ... la pregunta sigue en pie. ¿Podemos detectar si un usuario ya tiene una pestaña abierta en su sitio?

---

Esta pregunta es no sobre cómo detectar cuando un usuario ha completado el proceso de registro. El sondeo o cometa Ajax puede resolver ese problema. Específicamente, quiero saber si el usuario ya tiene una pestaña abierta en su sitio o no.

Answer 1

Llego bastante tarde a la fiesta aquí (más de un año), pero no pude evitar darme cuenta de que te habías perdido una solución increíblemente fácil y elegante (y probablemente lo que ese sitio web que viste usó).

Uso de JavaScript se puede cambiar el nombre de la ventana que tiene actualmente abierto a través de:

window.name = "myWindow"; 

Entonces, cuando usted envía el correo de confirmación simplemente hacer (suponiendo que usted está enviando un correo electrónico HTML):

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

Lo que debería dar como resultado la apertura de verificationLink dentro de la ventana en la que ya se cargó su sitio web, si ya se ha cerrado abrirá una nueva pestaña con el nombre de ventana especificado.

Answer 2

Puede enviar una solicitud AJAX cada X segundos desde la pestaña original que le pregunta al servidor si recibió una solicitud del correo electrónico.

No puede cerrar la segunda pestaña automáticamente, pero puede solicitarla al servidor después de 3X segundos, ya sea que se escuche desde la primera pestaña.

Answer 3

El usuario todavía tendrá una sesión en el servidor. ¿Por qué no almacenar la ubicación del usuario antes de registrarse? Y cuando confirman su registro, vuelva a leer la ubicación de la sesión y redirija a esa página. No se requiere magia de tabulación. Ciertamente no es lo que esperaría de un proceso de registro.

Answer 4

Puede detener la funcionalidad de la página cuando el usuario abre otra pestaña o una ventana o incluso otro navegador

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

Answer 5

Lo que tenemos aquí es un diferente caso de uso poco para ti, pero que detecta si el sitio está siendo accedido en otra pestaña. En este caso, quería limitar el uso de algunas páginas del centro de llamadas a solo una pestaña. Funciona bien y es puramente del lado del cliente.

// 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); 
} 

Answer 6

Para agregar a otras respuestas: También puede utilizar localStorage. Tener una entrada como 'openedTabs'. Cuando se abre su página, aumente este número. Cuando el usuario abandona la página, disminuya.