javascript - Backbone js 防止后退/前进时 url 哈希更改

Question

我正在使用 Backbone.js 开发一个非常基本的 SPA。我的应用程序有几条路线。其中有 2 个给我带来了问题:索引路由(“/#index”)和菜单路由(“/#mainmenu”)。

我的应用程序中的一个简单工作流程如下:用户填写表单 -> 单击登录 -> 触发 ajax 请求 -> 如果登录成功，则转到“/#mainmenu”路线。如果登录失败，则继续使用“/#index”路线。在“/#mainmenu”上，如果用户单击注销 -> ajax 请求 -> 如果注销成功，则转到“/#index”。如果注销失败，则保留在“/#mainmenu”上。

我正在努力解决的问题是:

1. 成功登录后触发转换到“/#mainmenu”的干净方法(我目前使用 router.navigate("mainmenu", {trigger: true}); 但请阅读 derrick bailey 的文章，应避免使用此方法https://lostechies.com/derickbailey/2011/08/28/dont-execute-a-backbone-js-route-handler-from-your-code/)
2. 一种干净的方法，可以防止用户从“/#mainmenu”路径按浏览器中的“后退”按钮时返回“/#index”。我还想保留 url 哈希以反射(reflect)当前 View 。
3. 阻止用户在成功注销后前进到“/#mainmenu”。
4. 是否可以在单击浏览器后退/前进按钮时防止网址哈希更改？

当我说“干净”时，我指的是“最佳实践是什么？”。我通过保存 url 哈希并恢复适当的哈希(通过 router.navigate(currentRoute, {replace: true}); )部分解决了一些问题，但我觉得这是一种 hacky 方法。

欢迎并非常感谢任何反馈。

Answer 1

解决此问题的一种方法是在执行实际回调路由之前，对需要进行身份验证状态检查的路由应用异步 before 过滤器。

例如: https://github.com/fantactuka/backbone-route-filter

避免{trigger: true}的理念基于以下事实:当路由器被此标志触发时，该路由的整个初始化过程都会被触发。您将失去先前定义的应用程序状态的好处，因为应用程序必须重新初始化所有内容，而这项工作之前已经完成。

在实践中，我认为评估您的网络应用程序的实际功能很有用。如果丢失应用程序状态不是问题，因为您要渲染的 View 是全新的，那么我认为创建重新初始化应用程序的客户端重定向不会有问题。
另一方面，如果您的应用程序有许多已呈现的 View ，您希望保持与以前相同的状态，则可以在需要它的每个组件上监听身份验证状态事件，并仅使这些 View 相应地重新呈现如果他们需要的话。