Backbone.js y almacenamiento local con múltiples pestañas del navegador/ventanas sobrescribe los datos

Question

a muy poca pregunta sobre el uso de Backbone.js con LocalStorage:

Estoy almacenando una lista de cosas (colección Backbone) en LocalStorage. Cuando mi sitio web está abierto en varias ventanas/pestañas del navegador y el usuario en ambas ventanas agrega algo a la lista, los cambios de una ventana sobrescribirán los cambios realizados en la otra ventana.

Si quieres probar por sí mismo, sólo tiene que utilizar el ejemplo Backbone.js Todo aplicación:

1. abierto http://backbonejs.org/examples/todos/index.html en dos pestañas del navegador
2. Añadir un elemento 'ELEMENTO1' en la primera pestaña y 'elemento2 'en la segunda pestaña
3. Refresh dos pestañas: 'elemento1' desaparecerá y se le dejó con 'elemento2' sólo

alguna sugerencia de cómo evitar que esto suceda, cualquier forma estándar para de al con esto?

THXX

Answer 1

Se ha producido un problema conocido de pérdida de concurrencia, consulte Lost update in Concurrency control?. Sólo para su comprensión que podría proponer la siguiente solución rápida y sucia, presentar backbone-localstorage.js, Store.prototype.save:

save: function() { 
    // reread data right before writing 
    var store = localStorage.getItem(this.name); 
    var data = (store && JSON.parse(store)) || {}; 
    // we may choose what is overwritten with what here 
    _.extend(this.data, data); 

    localStorage.setItem(this.name, JSON.stringify(this.data)); 
} 

Para el latest Github version of Backbone localStorage, creo que esto debería tener este aspecto:

save: function() { 
    var store = this.localStorage().getItem(this.name); 
    var records = (store && store.split(",")) || []; 
    var all = _.union(records, this.records); 
    this.localStorage().setItem(this.name, all.join(",")); 
} 

Answer 2

Es posible que desee utilizar sessionStorage lugar. Ver http://en.wikipedia.org/wiki/Web_storage#Local_and_session_storage.

Answer 3

comentario de Yaroslav acerca de la comprobación para los cambios antes de persistir los nuevos es una solución, pero mi sugerencia sería diferente. Recuerde que localStorage es capaz de activar eventos cuando realiza acciones que cambian los datos que contiene. Vincúlate con esos eventos y haz que cada pestaña escuche esos cambios y visualice la repetición después de que ocurra.

Luego, cuando hago eliminaciones o adiciones en una pestaña y paso a la siguiente, obtendrá un evento y un cambio para reflejar lo que sucedió en la otra pestaña. No habrá discrepancias extrañas en lo que estoy viendo pestaña a pestaña.

Desea pensar en asegurarse de que no pierdo algo que estaba en el medio de agregar (digamos, empiezo a escribir una nueva entrada para mi lista de tareas pendientes), cambiar a otra pestaña y eliminar algo, y luego regrese. Quiero ver que la entrada desaparezca pero mi nuevo ítem parcialmente tipado aún debería estar disponible para mí.