Javascript backbone.js和具有多个浏览器选项卡/窗口的本地存储将覆盖数据

关于如何将Backbone.js与LocalStorage结合使用，只需回答一个非常简短的问题：

我正在本地存储中存储一个内容列表（主干集合）。当我的网站在多个浏览器窗口/选项卡中打开，并且两个窗口中的用户都向列表中添加了内容时，一个窗口的更改将覆盖另一个窗口中所做的更改

如果您想自己尝试，只需使用示例Backbone.js Todo应用程序：

在两个浏览器选项卡中打开

在第一个选项卡中添加项目“item1”，在第二个选项卡中添加项目“item2”

刷新两个选项卡：“item1”将消失，只剩下“item2”

有没有建议如何防止这种情况发生，有没有标准的方法来处理

---

Thxx

您可能想改用sessionStorage。

---

请参阅。

问题是众所周知的并发丢失更新问题，请参阅。 为了您的理解，我可能会提出以下快速而肮脏的解决方案，文件

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

我认为这应该是这样的：

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(","));
}

---

Yaroslav关于在坚持新的更改之前检查更改的评论是一种解决方案，但我的建议会有所不同。请记住，当localStorage执行更改其保存的数据的操作时，它能够触发事件。绑定到这些事件，让每个选项卡侦听这些更改，并在更改发生后查看重新渲染

然后，当我在一个选项卡中进行删除或添加并移动到下一个选项卡时，它将得到一个事件和更改，以反映在另一个选项卡中发生的情况。我所看到的每一页都不会有奇怪的差异

---

<>你想给我一些想法，确保我不会丢失我正在添加的东西（比如我开始为我的待办事项列表键入一个新条目），切换到另一个标签并删除一些东西，然后回来，我想看到条目消失，但我的部分键入的新条目应该仍然可以使用。

这是正确的答案。backbone.js只有一个本地存储适配器，您必须编写自己的实现才能使用会话存储对不起，我应该说得更清楚。我想要的是本地存储，因为我需要在会话之间持久化数据。以上面的待办事项列表为例：您不希望在关闭选项卡或浏览器窗口时清除待办事项列表。下次你回到应用程序时，你希望它在那里。想象一下，你打开了两个窗口，填充了不同的数据，关闭了两个窗口，打开了一个新窗口。它应该从之前关闭的两个数据库中的哪一个获取数据？你需要全面的授权和认证。不，我不想识别或认证任何用户。这是一个非常简单的案例。再次以Todo应用程序为例：假设您在两个浏览器选项卡中打开了它。如果在两个选项卡中都添加todo项，则不需要第一个或第二个选项卡的数据。很明显你两者都想要。如果在两个选项卡中都添加todo项目，则您希望两个项目都存储在本地存储中，而不是稍后添加的项目覆盖第一个项目。此解决方案具有更好的用户体验。此解决方案在形式上更为正确，而且不会太有攻击性，真的！但它在IE、Safari和Chrome方面有很多怪癖或缺乏支持。刚刚尝试过，它在FF中运行得很好，但在Chrome中并不是很好，这就是为什么我使用上面提到的hack。谢谢！只是我需要的提示。我知道这是一种黑客行为，但它确实起到了作用。我编辑了您的回复，以包含与最新Github版本的Backbon localStorage一起工作的代码。我今天在公司遇到了这个问题。非常感谢您的快速修复！这真的很有帮助！