如果用户离开页面，如何维护页面状态？

Question

我有一个页面根据用户交互改变dom。但是，用户可能会单击链接，该链接将导航到外部站点。如果用户单击后退按钮，则会再次显示我的页面，但dom更改不会持续存在。

跟踪用户互动的最佳方式是什么，以便我可以在返回时重建页面？

为了维护状态并重建页面，我需要跟踪7-10个变量。

我有一些想法：

• 服务器端会话 - 每次变量更改值时都需要回调服务器？
• 客户端Cookie - 如果用户停用Cookie会怎么样？
• 隐藏的表单字段 - 大多数（所有？）浏览器在本地缓存表单数据，因此按下后退按钮应保留吗？

Answer 1

在大多数情况下，我会说最好的方法是在URL中表示页面状态。

原因如下：

• 由于URL是一个如此简单的概念，因此无论使用何种浏览器或使用何种隐私设置（例如，允许使用Cookie和本地存储），此方法都可以使用。
• 如果用户A将URL发送给希望看到该页面处于相同状态的用户B，这仍然有效。对于您所考虑的任何方法，情况都不是这样。

如果您要跟踪的变量与特定用户（或会话）相关，那么在某种会话中跟踪这些变量会更明智。这可以是服务器端或客户端。

本地或会话存储（HTML5 Local storage vs. Session storage）是可能的解决方案，但有一些限制。

1. 不适用于所有浏览器或浏览器设置（旧版浏览器不支持HTML5本地存储，例如我知道在私有模式下运行Safari不允许本地存储）
2. 如果您要将链接发送给其他用户，他将不会看到该页面处于相同状态，因为他之前没有访问过该页面，并且他的本地或会话存储空间尚未填充正确的值。 / LI>

Answer 2

尝试min-date变量：

Session

然后回想起来：

sessionStorage.setItem('key', { "data": "mad data here" });

您可以在加载页面时使用jQuery：

var data = sessionStorage.getItem('key');