Question

我已经设置了一个超级简单的Backbone应用程序，只有一个路由器和两个视图，试图找到正确的方法来处理没有hashbang的路由。

var Router = Backbone.Router.extend({
    routes: {
        '': 'index',
        'episodes': 'episodes'
    },

    index: function () {
        var view = new IndexView();
        view.render();
    },

    episodes: function () {
        var view = new EpisodesView();
        view.render();
    }
});

var IndexView = Backbone.View.extend({
    el: $('#primary'),
    render: function () {
        console.log('index view');
    }
});

var EpisodesView = Backbone.View.extend({
    el: $('#primary'),
    render: function () {
        console.log('episodes view');
    }
});

var router = new Router;
Backbone.history.start({pushState: true});

我意识到history对象允许页面之间的向前和向后导航，这很棒。然而，它实际实施的方式似乎有点混乱。

例如，我创建了一个简单的MAMP服务器来提供index.html文件和JS文件。导航到http://backbone:8888/，控制台会像{I}告诉它一样记录index view。但是，导航到http://backbone:8888/episodes（通过在地址栏中输入）会返回404.但是，如果我导航到http://backbone:8888/#episodes，则网址会重定向到http://backbone:8888/episodes（没有主播）和我获取episodes view登录到控制台，这显然意味着它正在点击EpisodesView视图。

从这里，我可以在索引和剧集视图之间来回切换。（回击/，前进/剧集）。在/episodes再次点击刷新之前，这一切都很好，很花哨。 404 ...

所以我的问题是：如何设置Backbone来处理URL而不依赖于hashbang？我在这个主题上找到的所有内容都表示＆＃34;哦pushState！＆＃34;。好吧，我正在使用pushState，就像我上面所描述的那样，您无法直接点击/episodes这样的网址而无法获得404.

Answer 1

当您使用推送状态时，页面将从后端提供，这意味着您必须在后端定义与前端路由对应的相应路径。

如果后端没有找到所请求的路线，那么它将发送404消息，因为它不知道要发送什么。在您的情况下，剧集视图在前端级别被触发，但是当页面被刷新时，浏览器没有DOM来呈现视图，因为没有提供任何内容。

默认情况下，路由http://backbone:8888/将为索引文件提供服务，因为这是配置Web服务器的方式我不确定您使用的是哪种后端技术，但是为了从http://backbone:8888/episodes提供文件，只需确保您的后端设置了一个路由器，该路由器可以满足所请求的路由，并且它应该可以正常工作。

骨干路由器没有hashbangs

1 个答案: