如何管理应用程序和URL中的状态

How to manage state in application and URL?

本文关键字：URL 状态 应用程序 何管理 管理      更新时间：2023-09-26

我正在构建一个web应用程序，通过内部和URL管理状态，允许用户使用浏览器按钮以及网站的UI操作状态。

我使用jQuery-BBQ来管理URL哈希，并且我有一个hashchange处理程序，当URL发生变化时相应地改变事情(例如浏览器按下后退/前进按钮)。然而，事情本身也发生了相应的变化，最终会改变哈希值，从而触发hashchange处理程序并导致循环。

为了解决这些情况，我发现自己检查新状态是否与前一个状态相同，如果是，则退出。但我很快就得到了相当复杂的代码，分别处理每个状态，并在每个状态上操作多个参与者。

是否有一种设计模式可以优雅地处理这种状态管理场景?

我现在不能推荐任何具体的设计模式来实现，但我可以建议你看看html5的pushSate()和popState()函数。这些函数能够存储状态以及与这些状态相关联的数据。Github.com使用这种技术来遍历某个公共存储库的目录。这里有一个快速指南:https://developer.mozilla.org/en/DOM/Manipulating_the_browser_history。

我最终做的是严格地在我的程序中只提供一个可以更改状态的地方，并通过该地方路由所有状态更改。

这里的"一个地方"是指一组可公开访问的函数，它们的工作包括:

  1. 验证请求的状态更改
  2. 正在验证新请求的状态更改与当前状态不同
  3. 更新应用程序状态
  4. 更新浏览器状态

步骤2可能是最重要的——它确保状态更改请求是来自应用程序内部还是来自浏览器，在初始更改之外，不会有任何重复尝试更改应用程序或浏览器中的状态。

到目前为止都很好，这似乎将状态机的复杂性封装在我的一部分代码中，使其更容易保持直接…不过，我欢迎任何其他答案。我敢肯定这个问题已经被解决过很多次了。

相关文章：