骨干路由器、pushstate 和相对 url答案

【问题标题】：Backbone router, pushstate, and relative urls骨干路由器、pushstate 和相对 url
【发布时间】：2013-02-11 22:03:30
【问题描述】：

我正在制作我的第一个主干应用程序。我启用了 pushstate。在路由器中我有两条路由。

    'link1(/)' : 'link1Route',              
    'link2(/)' : 'link2Route'

在我的链接 1 页面上，我有一个指向链接 2 的链接，如下所示：

    <a href="link2">Link2</a>

我点击链接，路由器接管并按预期转到link2Route。但是，如果我将鼠标悬停在链接上，状态栏会显示链接位于 domain.com/link1/link2 而不是 domain.com/link2。鉴于 link1 页面上的相对 url 结构，这是正确的。不幸的是，如果用户决定在新窗口或选项卡中打开链接，骨干网的路由器将不会生效。这是意料之中的，因为在新窗口或选项卡中打开会导致从服务器加载新页面。问题当然是 domain.com/link1/link2 不存在。

有什么方法可以处理这种情况？谢谢。

【问题讨论】：

尝试将您的锚点更改为 Link2
哇，我想这样就可以了。如此简单，但对我不起作用，因为我没有设置虚拟主机，所以即使我在 localhost/backboneapp/link2 中，它最初也会转到 localhost/link2。太棒了，谢谢你！我会再玩一些，但看起来这就是我需要的。

标签： backbone.js pushstate backbone-routing

【解决方案1】：

正如 mateusmaso 所指出的，您需要将链接目标更改为“/link2”（即包括“/”）。

此外，在实现 pushState 时，不要忘记如果用户请求“domain.com/link2” URL，您需要您的服务器响应内容。如果您愿意，响应可以是 index.html，但服务器必须返回该 URL 的页面。

如果您为所有与 Backbone 相关的 URL 返回 index.html，则当您的 Backbone 应用程序启动时，将触发路由处理代码并显示正确的数据。

如果您想了解有关路由的更多信息以及如何正确管理路由，而无需在调用 navigate 时通过 trigger: true，请查看此免费示例 pdf 的第 32-46 页：http://samples.leanpub.com/marionette-gentle-introduction-sample.pdf（完全披露，我我是书作者）

【讨论】：

谢谢，大卫。我会看看你的pdf。我实际上已经完成了你的 Marionette 教程，它们对我非常有用。我相信这本书会是一样的:)
谢谢，我正在尽我最大的努力写一本对读者有用的书。但是如果你只是想了解更多关于路由的知识，那么示例 pdf 应该就足够了。

【解决方案2】：

您必须在服务器级别提供正确的 index.html - 因为这是在 JavaScript 甚至在页面上加载之前。

http://readystate4.com/2012/05/17/nginx-and-apache-rewrite-to-support-html5-pushstate/

【讨论】：

我已经重写了apache。这将涵盖页面存在的场景。因此，在我的示例中，如果直接从书签或页面刷新加载，则 domain.com/link1 和 domain.com/link2 都将起作用，因为您共享的链接中的 apache 重写规则。但这没有考虑到我的问题是 domain.com/link1/link2 不应该存在。