Datos específicos de la ficha del navegador de la tienda

Question

Tengo una aplicación web que almacena información sobre páginas visitadas recientemente, llamémoslas A. Cuando un usuario visita otro tipo de página, llamado B, presto un menú en la parte superior con un botón para señalar la página A visitada más recientemente. Las páginas B son accesibles a través de una página A o una página B y pueden ser consideradas propiedad de A.

Esto funciona bien pero se convierte en un problema cuando alguien abre dos pestañas y cuando está en una B -página en la pestaña 1 con un enlace a la página A A1, abren una nueva pestaña y visitan la página A A2. Cuando el usuario actualiza la página B en la pestaña 1, el menú cambia a A2. Me gustaría poder identificar qué pestaña se está utilizando para poder guardar A1 en la pestaña 1 para que no cambie a A2.

Cuando se utiliza una pestaña:

A1 -> B1 -> B2 (the menu points back to A1) 

Cuando se utilizan dos pestañas:

Time   | T1  | T2  | T3   
----------------+----------+----------+------------- 
Tab 1:   | A1 -> B1 |   | [refresh B1] 
Tab 2:   |   | A2 -> B3 |    
----------------+----------+----------+------------- 
Menu points to: | A1 A1 | A2 A2 | A2 

Esto confunde a los usuarios cuando de nuevo en la pestaña 1 viene al usuario que estaban viendo en la pestaña 2 (A2) en lugar de A1.

Me temo que no es posible obtener la ID de la pestaña del navegador, pero ¿alguien podría tener alguna idea de una solución alternativa?

Answer 1

Edit: El paso del tiempo ha hecho que mi respuesta original de 2012 sea incorrecta. Como Bedrin señala, puede utilizar ahora el Window.sessionStorage object:

La propiedad sessionStorage le permite acceder a un objeto de sesión de almacenamiento para el origen actual. sessionStorage es similar a Window.localStorage, la única diferencia es que mientras los datos almacenados en localStorage no tienen un set de caducidad, los datos almacenados en sessionStorage se borran cuando finaliza la sesión de la página. Una sesión de página dura todo el tiempo que el navegador está abierto y sobrevive a las recargas y restauraciones de página. Abrir una página en una nueva pestaña o ventana provocará que se inicie una nueva sesión, que difiere de cómo funcionan las cookies de sesión.

respuesta original (2012):

Me temo que esto no será posible de una manera portátil, como usted ha descubierto a sí mismo, no es posible recuperar algo así como una identificación pestaña del navegador . Los estándares HTML son, hasta donde yo sé, completamente ajeno a las pestañas en los navegadores.

La única solución que puedo pensar es la siguiente: Implementar y administrar pestañas en su aplicación. He visto varias aplicaciones web empresariales que hacen esto, pero (en mi humilde opinión) la experiencia del usuario es bastante mala.

Answer 2

Así que he hecho una solución que parece funcionar bastante bien NO LO HACE. Ver el último problema-bala. Todavía estoy esperando mejores ideas, así que por favor avíseme si ya lo hizo.

De todos modos; así es como lo hice. Tenga en cuenta que esta no es una solución 100% infalible, si un usuario "se comporta mal" y actualiza varias pestañas al mismo tiempo, puede confundirse:

base.html (que todas las páginas hereda) ({{A}} renders una variable de Django):.

// This is executed right before leaving the page 
window.onunload = function() { 
    if('{{ A }}' != null) 
     var prev_A = '{{ A }}'; 
    else if (typeof previous_A != 'undefined') { 
     var prev_A = previous_A; 
    else 
     var prev_A = ''; 
    localStorage.setItem('a', prev_A); 
}; 
// Remove the local storage as soon as you get to this page 
localStorage.removeItem('a'); 

B_base.html (la plantilla base de todos los de B B_base.html también hereda base.html. pongo este código a ejecutar justo antes del código en base.html)

var previous_A = localStorage.getItem('a'); 

Así que básicamente lo que me pasa es que cada página establece el localStorage 'a' cuando sale de la página y elimina el localStorage 'a' como tan pronto como ingrese a la página, a excepción de las páginas B que primero guardan 'a' como una variable local antes de eliminarlo.

Problemas:

• enlaces de apertura en varias pestañas al mismo tiempo se sobreescriben esta variable y una pestaña no podrá contar con previous_A.
• Al cerrar una pestaña A sin ir a ninguna parte, abrir una nueva página B directamente dará como resultado que la pestaña B tenga el valor A cerrado en su anterior_A.
• Abrir B-links en pestañas nuevas de A-page no les devuelve el enlace ... Este es el acuerdo.

Answer 3

HTML5 sessionStorage resuelve este problema:

sitios pueden agregar datos al almacenamiento de las sesiones, y será accesible a cualquier página del mismo sitio abierto en esa ventana.

Se está supported by all modern browsers

Otro enfoque es utilizar window.name propiedad. Es específico de la pestaña/ventana y permanecerá sin cambios en la navegación del navegador. Por lo tanto, puede almacenar algo de identificación de rey de pestaña dentro de su propiedad window.name