Existe-t-il un moyen de modifier la barre d'adresse du navigateur sans actualiser la page?

Je développe une application Web. Dans celui-ci, j'ai une section appelée catégories que chaque fois qu'un utilisateur clique sur l'une des catégories, un panneau de mise à jour charge le contenu approprié.

Une fois que l'utilisateur a cliqué sur la catégorie, je souhaite modifier l'URL de la barre d'adresse du navigateur

www.mysite.com/products 

à quelque chose comme

www.mysite.com/products/{selectedCat} 

sans actualiser la page.
Existe-t-il une sorte d'API JavaScript que je peux utiliser pour y parvenir?

Avec HTML5, vous pouvez modifier l'url sans recharger:

Si vous souhaitez créer un nouveau message dans l'historique du navigateur (le bouton de retour fonctionnera)

window.history.pushState('Object', 'Title', '/new-url');

Si vous souhaitez simplement modifier l'URL sans pouvoir revenir en arrière

window.history.replaceState('Object', 'Title', '/another-new-url');

L'objet peut être utilisé pour la navigation ajax:

window.history.pushState({ id: 35 }, 'Viewing item #35', '/item/35');

window.onpopstate = function (e) {
  var id = e.state.id;
  load_item(id);
};

En savoir plus ici: http://www.w3.org/TR/html5-author/history.html

Une solution de secours: https://github.com/browserstate/history.js

Pour ajouter à ce que les gars ont déjà dit, modifiez la propriété window.location.hash pour qu'elle corresponde à l'URL que vous voulez dans votre fonction onclick.

window.location.hash = 'category-name'; // address bar would become http://example.com/#category-name

Je pense que manipuler directement la barre d'adresse vers une URL complètement différente sans passer à cette URL n'est pas autorisé pour des raisons de sécurité, si vous en êtes satisfait.

www.monsite.com/products/#{selectedCat}

c'est-à-dire un lien de style ancre dans la même page, puis regardez dans les divers scripts d'historique / "bouton retour" qui sont maintenant présents dans la plupart des bibliothèques javascript.

La mention du panneau de mise à jour m'amène à deviner que vous utilisez asp.net, dans ce cas, le contrôle d'historique ajax asp.net est un bon point de départ

Je ne pense pas que cela soit possible (au moins changer pour une adresse totalement différente), car ce serait une mauvaise utilisation non intuitive de la barre d'adresse et pourrait favoriser les attaques de phishing.

Cela ne peut pas être fait comme vous le dites. La méthode suggérée par somej.net est la plus proche que vous puissiez obtenir. C'est en fait une pratique très courante à l'ère AJAX. Même Gmail l'utilise.

"window.location.hash"

comme suggéré par sanchothefat devrait être la seule et unique façon de le faire. Parce que tous les endroits où j'ai vu cette fonctionnalité, c'est tout le temps après le # in URL.