首选的客户端路由解决方案是什么？

Question

我正在设计一个基于浏览器的单页面Web应用程序。

已经在我的应用程序中使用了 JQuery。目前计划使用 KnockoutJS 进行数据绑定和UI管理。但是，在过去，我曾经使用过 Backbone.js，并且对控制器层提供的路由设施印象深刻。

我还研究了一些基于 jQuery 的解决方案，例如客户端路由库pathjs。

如果有人能够提供选择合适路由系统的建议和指导，那就太好了。

由于 KnockoutJS 提供了出色的数据绑定功能，因此我不愿意使用 Backbone.js 代替它。

- lorefnon

---

你的问题不够清晰，无法得到答案（对我来说）。你能澄清一下你所指的“适当路由系统”是什么意思吗？ - Bill Eisenhauer

我所说的路由系统是指一种灵活的客户端解决方案，可以将像mydomail.com/#!/action/param1/param2这样的URL映射到特定的操作。 - lorefnon

我假设你已经阅读了这个链接：http://documentcloud.github.com/backbone/#Controller-routes 如果你计划使用backbone.js，但仍不确定你正在寻找什么。路由基础设施已经存在，你需要根据你的应用程序适当地叠加路由。 - Bill Eisenhauer

PathJS不是基于jQuery的解决方案。它没有外部依赖，也不包含其他库。它完全独立，但可以与所有其他库很好地配合使用。 - Mike Trpcic

Answer 1

经过一番探索，我找到了解决方法。 @Eisenhauer Backbone的路由设施非常棒，但如果我没有使用Backbone怎么办。 就像我在问题中概述的那样，我已经在使用提供了客户端MVVM模型的KnockoutJS，所以在同一页中再加入一个MVC实现并不是一个好主意。

对于寻求独立路由解决方案的人，pathjs是一个简单而优雅的解决方案。

一个更灵活、强大且独立的路由解决方案是Crossroads.js，它可以在http://millermedeiros.github.com/crossroads.js/上找到。 它的文档非常良好，而且非常强大，可以适应任何需求。

- lorefnon

---

绝对同意PathJs非常棒。它非常简单和小巧。我正在使用Saltarelle C#到JS编译器，并创建了一个包装器：https://github.com/mattleibow/Saltarelle.PathJs - Matthew

在类似于您自己的设置中，我使用了SammyJS，但现在它已经过时了，我建议使用现代SPA框架。 - Kevin Farrugia

Answer 2

你可以使用History API而不是哈希路由的方法？

• 它允许您操作用户显示的URL。
• 这意味着回退/前进按钮能够正常工作。
• 网页书签能够正常工作。
• 从性能上来看更好，因为如果用户刷新页面（或从外部源点击页面链接），正确的内容将首次加载，而不需要先加载一个空白页面，然后通过AJAX获取正确的内容。

缺点是旧版浏览器不支持。你可以回退到哈希路由（如果你真的需要）。我不知道任何现有的框架会这样做。我宁愿回退到不动态加载内容的方式（例如用户单击链接时重新加载整个页面）。历史记录API将越来越广泛地得到支持，因此这个“问题”随着时间的推移会减少。

这里有一个实例和一些文档。从地址栏中看，页面似乎是“老派”的方式加载（整个页面刷新），但是如果您查看控制台（Firebug、Chrome开发工具），您可以看到内容是通过AJAX请求获取的。

Mozilla有一些相关文档。

- Spycho

---

感谢你提供了非常有见地的答案。我会点赞并感激你的努力。然而，对于几个原因来说，一个路由方案是更好的方法。请注意，所有客户端路由解决方案都仅基于 History API，并提供非常简单的机制来将 URL 与方法/AJAX 请求连接起来。因此，与手动监控 URL 并相应地执行任务相比，极大地减少了开发者需要做的工作量。 - lorefnon

啊，好的。抱歉，我误解了你的意思。我以为你提供的示例链接（mydomail.com/#!/action/param1/param2）是指哈希解决方案。 - Spycho

目前IE不支持History API（直到v10 http://caniuse.com/#search=history）。history.js库处理回退到hashbangs。 - joeriks

Answer 3

还有优秀的Director

- Shekhar

---

是的，我最近也发现了它。它是一个非常优秀、轻量级和简单的路由解决方案，具有非常干净的API。感谢指出。 - lorefnon

看起来这个项目已经被重命名并移动了：Flatiron Director -- 不过是一个很棒的解决方案。 - nickb

@nickb 你是对的。我正在编辑答案。 - Shekhar

如果需要，它不支持IE8。 - Swaff

Answer 4

Crossroads.js似乎是最好的之一。它的一个主要优点是，它不依赖于window.location进行路由。它非常轻量级，因为它只专注于路由。

其他你可能想尝试的包括：finch.js， davisjs（基于pushState，这样如果JS失败，您可以使用现有链接作为后备）

追加更新：2015年3月30日 - 去年末我转向了AngularJS。毫无疑问，这是从JQ切换的最佳选择，具有许多内置模块，如路由。

- Deepak Thomas

---

你好，目前我们正在考虑从Knockout和Crossroads迁移到Angular 4。 我们的方法将是逐页迁移项目，并尝试在Angular中使用Crossroads。我想知道您在迁移到Angular时是否遇到了任何问题，以及您的经验如何？最好的问候， - stckvflw

我曾经单独使用过Angular 1.x。Angular的UI-Router是一个非常出色的路由框架，比上面列出的其他框架要好得多（因为它有“状态”）。我没有使用过Angular 4，但我相信你会找到一个类似于UI-Router的东西，或者Angular 4可能已经内置了它。我不确定。 - Deepak Thomas