web-dev-qa-db-fra.com

Comment changer la barre d'adresse du navigateur sans recharger la page - HTML / Javascript

Duplicata possible:
Comment GitHub change-t-il l'URL mais pas le rechargement?

Salut les gens,

J'ai remarqué que Github.com n'oblige pas les utilisateurs à télécharger des pages Web lors de la navigation dans les référentiels, mais utilise plutôt AJAX afin d'actualiser le contenu de la page.

Github modifie également la barre d'adresse du navigateur à la véritable adresse représentant le contenu. Je n'ai aucune idée de comment implémenter cela si ce n'est en utilisant # hashtags dans l'url.


En bref: github utilise ajax pour charger de nouvelles pages Web, sans utiliser de hashtags. Comment font-ils cela?


Des idées?

35
RadiantHex

En utilisant:

window.history.pushState("string", "Title", "newUrl");

C'est nouveau dans HTML 5.

Votre URL passera à newUrl sans recharger la page.

Remarque: l'argument title dans la méthode ne changera pas le titre de la page html. Ceci est utilisé pour nommer la page dans l'historique du navigateur, au cas où vous reviendriez en arrière puis avancer.

47
euphoria83

Jetez un oeil à API historique HTML5 . Si vous prévoyez de l'utiliser, obtenir une bibliothèque qui l'encapsule et peut-être même ajouter un repli aux hachages d'emplacement serait une bonne idée.

https://github.com/browserstate/history.js ne semble pas mal à première vue.

10
ThiefMaster