Faire des liens comme Twitter, Hash-Bang #! URL
Duplicata possible:
À quoi sert le Shebang/hashbang (#!) Dans Facebook et les nouvelles URL Twitter?
Je me demandais comment Twitter fonctionne ses liens.
Si vous regardez dans le code source, vous utilisez les liens qui se font comme/#!/I/connect ou/#!/I/Discover, mais ils n'ont pas de fonction JavaScript attachée à eux comme load ('connect') ou quelque chose, et qu'il ne nécessite pas de rechargement de page. Cela modifie simplement le contenu de la page.
J'ai vu this page, mais alors tous ces fichiers devraient exister, et vous ne pouviez pas aller directement à l'un d'eux. J'imagine que sur Twitter, chacun de ces fichiers n'existe pas et qu'il est géré par une autre méthode. Veuillez me corriger si je me trompe.
Existe-t-il un moyen de reproduire cet effet? Si oui, existe-t-il un tutoriel sur la façon de procéder?
Navigation "Hash-Bang" , comme on l'appelle parfois, ...
http://example.com/path/to/#!/some-ajax-state
... est une solution temporaire à un problème temporaire qui devient rapidement un non-problème grâce aux normes de navigateur modernes. Selon toute vraisemblance, Twitter l'abandonnera, comme Facebook le fait déjà.
C'est la combinaison de plusieurs concepts ...
Dans le passé, un lien avait deux objectifs : il a chargé un nouveau document et/ou fait défiler vers le bas jusqu'à une ancre intégrée comme indiqué avec le hachage (#) .
http://example.com/script.php#fourth-paragraph
Tout élément d'une URL après le hachage n'a pas été demandé au serveur, mais a été recherché dans la page par le navigateur. Tout cela fonctionne toujours très bien.
Avec l'adoption d'AJAX , le nouveau contenu pourrait être chargé dans la page actuelle (déjà chargée). Avec ce chargement dynamique, plusieurs problèmes sont survenus : 1) il n'y avait pas d'URL unique pour créer un signet ou un lien vers ce nouveau contenu, 2) la recherche ne le verrait jamais .
Certaines personnes intelligentes ont résolu le premier problème en utilisant le hachage comme une sorte de référence "d'état" à inclure dans les liens et les signets. Une fois le document chargé, le navigateur lit le hachage et exécute les demandes AJAX, affichant la page et ses modifications dynamiques AJAX).
http://example.com/script.php#some-ajax-state
Cela a résolu le problème AJAX, mais le problème des moteurs de recherche existait toujours . Les moteurs de recherche ne chargent pas les pages et ne s'exécutent pas Javascript comme un navigateur.
Google à la rescousse. Google a proposé un schéma où toute URL avec un hash-bang (#!) Au lieu d'un simple hash (#) suggérerait au bot de recherche qu'il y avait une autre URL pour l'indexation, qui impliquait une variable "_escaped_fragment_", entre autres des choses. Lisez à ce sujet ici: Ajax Crawling: Getting Started .
Aujourd'hui, avec l'adoption du pushstate Javascript dans la plupart des principaux navigateurs, tout cela devient obsolète. Avec pushstate, comme le contenu est chargé ou modifié dynamiquement, l'URL de la page actuelle peut être modifiée sans provoquer de chargement de la page. Lorsque vous le souhaitez, cela fournit une véritable URL de travail pour les signets et l'historique. Les liens peuvent ensuite être créés comme ils l'ont toujours été, sans hachage ni hachage .
À partir d'aujourd'hui, si vous chargez Facebook dans un navigateur plus ancien, vous verrez les hash-bangs, mais un navigateur actuel montrera l'utilisation de pushstate.
Vous voudrez peut-être en savoir plus sur RL uniques .
Il charge la page via AJAX et analyse le "hachage" (les valeurs qui viennent après le "#") pour déterminer quelle page il va charger. En outre, cette méthode est utilisée en raison de la nature qui AJAX ne comptent pas dans l'historique du navigateur, donc le "bouton retour se casse". Mais le navigateur enregistre cependant dans l'historique les modifications du hachage.
En utilisant des hachages et le fait que vous pouvez utiliser des hachages pour déterminer des pages, vous pouvez dire que vous pouvez conserver AJAX pages demandées "dans l'historique". Ajouté à cela, les URL hachées ne sont que des URL, et elles peuvent être mis en signet, y compris le hachage, vous pouvez donc également mettre en signet AJAX pages demandées.