Question

看着将我的ASP MVC应用程序转换为纯JS / Html，但它不仅仅是一个1页的应用程序，它有几页，但每个都有很多ajax和事件。

无论如何，目前我在ASP MVC上的网址如下：

/login
/admin/{action}/{adminId}
/posts/{posterId}
/picture/{pictureId}

所以这一切都很简单，很容易看到你在网址中做了什么，你也得到了正确的后退按钮行为。所以试图将这种事情用于纯粹的JS / Html方法似乎有点困难或不可能。我不需要完全匹配，但我希望做类似的事情：

http://localhost/myapp/posts/10

然后，这将以某种方式能够将实际请求路由到http://localhost/myapp/posts.html并显示变量。现在我很确定这是不可能的，因为当上述内容进入浏览器时，它将尝试查找名为posts的目录并寻找10，这不存在。

现在我已经看过Crossroads和LeviRoutes以及其他一些类似的技术，但是它们似乎依赖于hashbang方法，有些人喜欢别人讨厌这种方法。有没有办法解决？如果没有，任何人都可以指出任何关于如何使用这些框架的好教程，因为每个框架在文档上看起来都相当轻松。

Answer 1

没有使用哈希的解决方法。 IE5和Opera尚未提供HTML5 History API。如果您的应用程序定位到非常特定的平台，那么您可以使用History API而不是hash。但是，History API在不同浏览器中不一致。您可以在此处阅读：http://www.battlehorse.net/page/2011/02/12/html5history.htm

如果您选择使用History API，那将很容易。您可以在ASP.NET MVC中使用所需的任何路由策略，然后在JavaScript中匹配此策略。您可以在此处详细了解历史记录API：https://developer.mozilla.org/en/DOM/Manipulating_the_browser_history

如果您选择使用哈希，则需要向AJAX请求发出一些请求：

确定是否通过AJAX完成请求：
- 如果GET/posts/{action}/{id}是AJAX，则提供原始内容
- 如果不是AJAX，则将用户重定向到/#!/posts/{action}/{id}。
通过请求正确的内容来处理客户端哈希：
- 当哈希值通过AJAX更改为#!/posts/{action}/{id}，GET /posts/{action}/{id}时，将内容替换为服务器中的新内容。
拦截form.onsubmit事件：
- 每当表单尝试提交到/posts/{action}/{id}时，取消它并使用AJAX发布，然后用服务器中的新内容替换内容。

现在，您的应用应该像单页应用一样工作。

Answer 2

如果您希望将其保持在客户端并与浏览器兼容，则没有真正的方法可以使用hashbang。

客户端URL路由

2 个答案: