Search code examples
javascriptnode.jsbackbone.jsroutesmarionette

Marionette app 2 way navigation with history api


I have node.js server application (rest API service). I also have Backbone + Marionette(for my serverside RESTful app) multiple page app at the client side. I currently have Marionette navigation which is work pretty good with links like domain.com/#feedbacks (pages are render on client side with ajax data). But I also want to add serverside navigation e.g. domain.com/feedbacks (for google and other seach engines).

The question is: How can I match serverside and clientside navigations?

Mb I should try to add event handler for all links on page, which is will do something like Backbone.history.navigate("/feedbacks")? But I have a lot different hash links(#feedbacks)... Mb there is a more elegant solution? Thank you.

My current marionette router:

var AppRouter = Backbone.Blazer.Router.extend({
    routes: {
      '': new HomeRoute(),
      'sell': new SellRoute(),
      'login': new LoginRoute(),
      'feedbacks': new FeedbacksRouter(),
      'product/:id': new ProductRoute(),
      'profile/:id': new UserRoute()
    }
  })

Solution

  • I just had to use:

    Backbone.history.start({pushState: true})
    

    instead of:

    Backbone.history.start();
    

    It make backbone routing work without # symbols