使用Node.js Express服务器使用Backbone.js pushState路由吗？

一尘不染

使用Node.js Express服务器使用Backbone.js pushState路由吗？

node.js

pushState Backbone.js的0.5版更新引入了对该功能的支持。

请注意，使用真实URL要求您的Web服务器能够正确呈现这些页面，因此也需要进行后端更改。例如，如果您的路由为/ documents /
100，并且浏览器直接访问该URL，则您的Web服务器必须能够提供该页面。为了获得完整的搜索引擎可爬网性，最好让服务器为页面生成完整的HTML
…但是，如果是Web应用程序，则只需呈现与根URL相同的内容，然后用Backbone填充其余内容视图和JavaScript可以正常工作。

这似乎是一个琐碎的问题，但是我想知道是否有人可以通过一些特定的（最好是express）node.js服务器代码来帮助我。我应该如何处理这些路线？我有点困惑。

这是我的应用程序路由器模块的相关摘录：

var Router = Backbone.Router.extend({
    routes: {
        '': 'index',
        'about': 'about'
    },
    index: function() {
        indexView.render();
    },
    about: function() {
        aboutView.render();
    }
});

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

return {
    initialize: initialize
};

在这里，我只有一条顶级路线和一个关于页面的路线。因此，我应该如何设置一个节点服务器，使我可以导航到：

domain.com
domain.com/about
domain.com/#/about // <- for browsers that don't support pushState

阅读 214

2020-07-07

共1个答案

一尘不染

说明

首先，您需要知道domain.com/#/about它将调用服务器的“
/”路由，因为它不读取＃片段。您的服务器将呈现Backbone.js应用程序的基础，而Backbone将触发“关于”路线。

因此，您需要在Express JS中声明两条路由：

/
/关于

码

app.get('/', function(req, res) {
    // Trigger the routes 'domain.com' and 'domain.com/#/about'
    // Here render the base of your application
});

app.get('/about', function (req, res) {
    // Trigger the route 'domain.com/about'
    // Here use templates to generate the right view and render
});

我建议您通过Derick Bailey与Backbone.js实现SEO兼容性的3个链接：

HTML5 PushState的SEO和可访问性，第1部分：PushState简介： http **：//lostechies.com/derickbailey/2011/09/26/seo-and-accessibility-with-html5-pushstate-part-1-introducing-pushstate/**
HTML5 PushState的SEO和可访问性，第2部分：Backbone.js的渐进增强： http **://lostechies.com/derickbailey/2011/09/26/seo-and-accessibility-with-html5-pushstate-part-2-progressive** -加强与骨干js /
使用HTML5 PushState进行SEO和可访问性，第3部分：视频： http **：//lostechies.com/derickbailey/2011/10/06/seo-and-accessibility-with-html5-pushstate-part-3-the-video/**

2020-07-07