Les routes principales sans hachage?

Question

J'utilise backbone pour un projet en cours. Je me demandais s'il était possible de faire un routage sans hashes # , comme le fait davis.js.

Merci!

Answer 1

Vous devez activer pushState

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

http://documentcloud.github.com/backbone/#Router

http://documentcloud.github.com/backbone/#History

Edit: Comme indiqué dans les commentaires cela ne fonctionne que pour les navigateurs qui prennent en charge pushState, les navigateurs qui ne le connaissent pas revenir à la méthode de hachage. Il n'y a pas de véritable moyen de contourner cela, vous pouvez activer le navigateur moderne et tomber en arrière, ou il suffit d'utiliser les hachages pour tous les navigateurs.

Answer 2

Backbone Boilerplate a une excellente aide qui permet de pousser. Je l'utilise chaque fois que je souhaite contourner mon routeur.

 // Trigger the initial route and enable HTML5 History API support, set the
// root folder to '/' by default.  Change in app.js.
Backbone.history.start({ pushState: true, root: app.root });

// All navigation that is relative should be passed through the navigate
// method, to be processed by the router. If the link has a `data-bypass`
// attribute, bypass the delegation completely.
$(document).on("click", "a[href]:not([data-bypass])", function(evt) {
  // Get the absolute anchor href.
  var href = { prop: $(this).prop("href"), attr: $(this).attr("href") };
  // Get the absolute root.
  var root = location.protocol + "//" + location.host + app.root;

  // Ensure the root is part of the anchor href, meaning it's relative.
  if (href.prop.slice(0, root.length) === root) {
    // Stop the default event to ensure the link will not cause a page
    // refresh.
    evt.preventDefault();

    // `Backbone.history.navigate` is sufficient for all Routers and will
    // trigger the correct events. The Router's internal `navigate` method
    // calls this anyways.  The fragment is sliced from the root.
    Backbone.history.navigate(href.attr, true);
  }
});