问题 如何将骨干路由器应用于完整路径,而不是哈希


这种可能性存在吗?我们的网站不是一个页面,而是所有压缩的js文件 application.js,我可以使用骨干路由器 location.path 解析?

我试试 Backbone.history.start(pushState: true)。它适合我,但它是否正确?我只需要初始解析,而不是复杂的路由和重定向 Backbone.Router


9637
2018-03-21 07:00


起源

你想达到什么目的?你能举一些例子和你已经尝试过的吗? - tkone
例如,当我打开路径 /testimonials 我想完成一些功能(在路由器中)。这就是我所需要的,因为我所有的模块都在里面 application.js (这是rails应用程序)。我想知道,我应该执行什么...... - ValeriiVasin


答案:


您可以使用标准路由器。当您实例化它并启动历史记录对象时,您可以设置它应该用作其基础的根目录。在这种情况下,你似乎想要使用'/'

var MyRouter = Backbone.Router.extend({
    routes: {
        "application/": "somefunc"
    }
}

var app = new MyRouter();
Backbone.history.start({pushState: true, root: '/'});

无论何时在服务器上调用任何目录,您都需要将Web服务器设置为提供HTML文件(因此,骨干,而不是rails,将处理您的路由)。

最后,在HTML文件中,我有一个在Dom上运行的函数,并将路径拉出URL并将其传递给 navigate

var path = location.pathname;
app.navigate(path, {trigger: true});

13
2018-03-21 12:19



IE存在问题... IE没有pushState和路由器总是要去 #my-path 代替 /my/path......有可能解决它吗? - ValeriiVasin
@InviS号 pushState 仅适用于支持HTML5 History对象的浏览器。 [Backbone将专门恢复到哈希解决方案[(documentcloud.github.com/backbone/#History-start)在不受支持的浏览器上。浏览器不支持的问题 pushState 当你通过修改它给它一个有效的URL时,浏览器会发出一个新的请求 location 目的。 - tkone
但我根本不需要pushState ......我用它来找到我在哪个页面...有什么方法可以做到吗?如何从根路径设置默认导航 /不是 #。 - ValeriiVasin
@InviS不需要 pushState。路由器接管您的页面的瞬间,它需要更改 location.hash 或使用History对象。如果您没有使用路由器来处理位置,为什么不使用a View 它“控制”你的页面。 - tkone
我解释一下:我有很多页面(Rails App),我使用的是Sprockets,所有的javascript都在application.js中。我需要一个路由器才能知道我访问的页面。我只需要 - 获取初始URL并检测路由是什么。并执行一些功能。但Backbone路由器可以使用 hashchange默认。 pushState 工作完美,但IE .... - ValeriiVasin


我用这个:

window.location.href.replace(Backbone.history.getFragment(), '');

获取骨干应用程序根目录的绝对URL。


1
2018-04-09 09:38





你需要编写自己的路由器,但幸运的是,这很简单。这是我刚为一个我正在研究的网站写的:

var routes = {
  "terms": "terms",
  "privacy": "privacy",
  "password-reset": "reset"
};

var path = window.location.pathname.replace("/", "");
var page = routes[path];
if (!page) {
  page = "404";
}

我不需要Backbone提供的任何花哨的匹配规则,但用正则表达式扩展这个想法并不难。或者有人可能会编写一个使用Backbone匹配逻辑的小模块,但不会执行hash / pushState重定向。


0
2017-07-13 20:34



这是一个非常简单的例子。通常,路线不是那么简单,你可能会发现需要提供这样的路线: /hello/world/:post/:date - ValeriiVasin


我有同样的IE问题,有一个简单的sollution。下载 Modernizr的 并包括它。

然后做:

Backbone.history.start({ pushState: Modernizr.history });

这应该可以解决问题。


-1
2018-03-07 15:14



Backbone会自动检测浏览器是否具有pushState,如果不支持pushState,它将回退到哈希值,因此这是不必要的 - 只需在history.start中将pushState设置为true即可。 - Jonathan Dumaine