Javascript HTML5 pushState在主干历史启动方法中的用途是什么
我有一个简单的Javascript HTML5 pushState在主干历史启动方法中的用途是什么,javascript,html,backbone.js,Javascript,Html,Backbone.js,我有一个简单的主干应用程序。我试图理解启动Backbone.History对象时传递pusState:true所产生的差异 JavaScript 问题1。当我通过pushState:true并打开localhost:3000/#/users/时,此url自动重定向到localhost:3000/users 为什么会发生这种重定向 问题2。当我没有通过pushState:true时,就不会发生重定向。 localhost:3000/#/users/工作正常,但localhost:3000/user
主干应用程序。我试图理解启动Backbone.History
对象时传递pusState:true
所产生的差异
JavaScript
问题1。当我通过pushState:true
并打开localhost:3000/#/users/
时,此url自动重定向到localhost:3000/users
为什么会发生这种重定向
问题2。当我没有通过pushState:true
时,就不会发生重定向。
localhost:3000/#/users/
工作正常,但localhost:3000/users
不工作
在history.start方法中传递此值的重要性是什么?为什么重要。在启动主干时包括pushState
选项。history
告诉主干使用HTML5历史API。基本上,此API允许您更改地址栏中的URL,而无需重新加载页面()。如果没有pushState
,主干将使用哈希(#
)来更改URL,因此它不必重新加载页面
当我通过pushState:true
并打开localhost:3000/#/users/时,此url会自动重定向到localhost:3000/用户。为什么会发生此重定向
由于启用了历史API,主干网将选择使用实际路由(localhost:3000/用户
)而不是哈希路由(localhost:3000/#/users/
)。但是,它仍然理解散列路由,因此它将它们重定向到实际路由。这样,如果在现有应用程序中启用了pushState
,则任何将哈希路由添加为书签的用户仍可以使用该书签。(当然,任何新书签都有正确的路径)
当我没有通过pushState:true时,则不会发生重定向。localhost:3000/#/users/工作正常,但localhost:3000/users不工作
对问题2的回答:当未启用pushState
时,主干网将仅使用哈希路由。因此,localhost:3000/#/users/
不会重定向,因为它是“正确”的路由:它将显示内容。根据您设置服务器的方式,localhost:3000/users
将
加载应用程序但不显示任何内容(或默认内容)
加载/users
资源,或
给你一个404错误
使用pushState时,您告诉主干应用程序从后端以定义的URL(不带哈希)获取HTML。这意味着您的后端需要为此做好准备,这就是如果您没有预见到后端资源,localhost:3000/users
在默认情况下无法工作的原因。不过,从后端获取HTML时不会刷新页面,因此不会中断JS的运行。
当使用不带pushState的哈希时,您只使用前端路由器(哈希路由)及其回调,不向后端发出请求 @Andred Burgess谢谢!这很有意义。如果您可以添加-为什么使用pushState很重要,那就太好了?或者使用基于散列的路由的缺点是什么。尽管这应该是完全不同的问题。我接受它+1.
var r = new (Backbone.Router.extend({
routes: {
"users": "allUsers",
"users/new": "createUser"
},
allUsers: function () {
v.render("showing all users");
},
createUser: function () {
v.render("showing form for creating new user");
}
}));
Backbone.history.start({ pushState: true });