在具有不同主页的单页应用程序中路由

Posted 2023-04-13

【中文标题】在具有不同主页的单页应用程序中路由

【英文标题】：Routing in a Single Page Application with a different home page

【发布时间】：2016-03-03 18:56:05

【问题描述】：

我有一个单页应用程序 - 这意味着服务器上的所有内容都被重定向到单个 index.html 文件，该文件使用 HTML5 历史 API (pushstate) 完成繁重的工作和路由。

现在，我想在旁边添加一个新的登录页面 - 我们称之为 landing.html，我希望客户在访问 / 和 index.html 时首先访问 landing.html，如果他们访问任何其他路线.

现在 IE9 不支持 HTML5 历史 API，所以使用像 /books/authors 这样的“hash urls”路径在其中变为 /#!/books/authors。由于 URL is not sent to the server 的哈希部分就服务器而言，所有路径都是 /，这意味着我无法根据该逻辑路由到 landing.html 或 index.html。

我想到了一个技巧 - 将带有 / 的 URL 重定向到 landing.html，在客户端检测 #!，在服务器（或客户端）上添加一个名为 notReallyHomePage 的 cookie 并重定向到正确的页面基于服务器上的cookie。这真的很hacky，不是一个好的解决方案。

在这种情况下处理路由的正确方法是什么？

^{我的后端在 ASP.NET MVC 中，但我认为这与问题无关}

【问题讨论】：

何不使用 ASP.NET MVC 提供的路由功能。

@Antony 因为这不是单页应用程序的工作方式。路由是在客户端完成的——所以当用户点击一个链接时，你实际上并不需要访问服务器。优点是大多数路由只需要来自服务器的 JSON（而不是标记），而其他路由则可以完全跳过服务器。

您可能想要一个包含路由逻辑的索引/容器页面之类的东西。该页面根据所选路线部分加载。由于您的路线没有被发送到服务器，我认为不可能立即加载正确的页面。

看看projects.jga.me/routie。似乎适合这份工作

@Cerbrus 这仍然意味着客户端的另一次往返。

【参考方案1】：

Hmmmmm...landing.html 的内容是什么？从它的名字我猜这是一个非常简单的页面。

难道你不能让它的内容成为 index.html 的一部分并根据“第一次使用”的逻辑隐藏/显示它吗？ 或者，如果landing.html 是您的营销或其他东西创建的一些奇怪的页面，则将其放置在根据相同逻辑隐藏/显示的 iframe 中。

（显然当你显示landing.html然后你隐藏index.html）

【讨论】：

不，拥有着陆页的一半目的是不加载整个 index.html。

好吧，在这种情况下，您的 cookie 解决方案似乎是最好的解决方法。就像你说的，把它叫做“landingPageVisited”之类的，默认情况下“/”会重定向到landing.html，除非cookie被设置为true。听起来不像 那个 hack-y :)