J'ai travaillé sur comment faire un SPA crawlable par google basé sur google instructions. Même si il y a bien quelques explications générales je ne pouvais pas trouver n'importe où une plus complète, étape par étape tutoriel avec des exemples réels. Après avoir fini ce que je tiens à partager ma solution, afin que les autres aussi s'en servir et éventuellement l'améliorer.
Je suis l'aide d' MVC avec Webapi des contrôleurs, et Phantomjs sur le côté serveur, et Durandal sur le côté client push-state activé; j'utilise aussi Breezejs de données client-serveur d'interaction, tout ce que je recommande fortement, mais je vais essayer de donner une explication qui va aussi aider les gens à utiliser d'autres plates-formes.
Réponse
Trop de publicités?
Joachim H. Skeie
Points
1400
Voici un lien vers un screencast-enregistrement à partir de mon Ember.js la Formation de la classe, j'ai organisé à Londres, le 14 août. Elle définit une stratégie à la fois pour l'application côté client et pour vous application côté serveur, ainsi que donne une démonstration de la façon dont la mise en œuvre de ces fonctionnalités vous fournir votre code JavaScript Simple-Page-Application à la dégradation gracieuse, même pour les utilisateurs avec JavaScript désactivé.
Il utilise PhantomJS pour faciliter l'analyse de votre site web.
En bref, les étapes sont les suivantes:
- Avoir une version hébergée de l'application web que vous souhaitez analyser, ce site a besoin d'avoir TOUTES les données que vous avez dans la production
- Écrire une application JavaScript (PhantomJS Script) pour charger votre site web
- Ajouter index.html ( ou "/" ) à la liste des Url à analyser
- Pop la première adresse URL est ajoutée à l'analyse de la liste
- Chargement de page et de rendre son DOM
- Trouver tous les liens sur la page chargée que les liens vers votre propre site (filtrage d'URL)
- Ajoutez ce lien à une liste de "crawlable" URL, si ce n'est pas déjà analysé
- Stocker le rendu DOM vers un fichier sur le système de fichiers, mais se débarrasser de TOUS les script-tags première
- À la fin, de créer un Sitemap.xml fichier w/analysées Url
Une fois que cette étape est terminée, c'est à votre backend pour servir la statique-la version de votre code HTML dans le cadre de la noscript tag sur cette page. Cela permettra à Google et autres moteurs de recherche de parcourir chaque page sur votre site web, même si votre application est à l'origine une seule page-app.
Lien vers la vidéo avec tous les détails:
