SEO Tools rendertron + ngrok – Analyse SEO d’une application SPA Angular en local

Analyse SEO d’une application SPA Angular en local

Faire une analyse SEO de son application SPA Angular/Ionic en local.

Lancer le serveur local Angular/Ionic

ionic serve
serveur local [http://localhost:8100](http://localhost:8100/)

Installer & lancer rendertron avec NPM

# Installer rendertron
npm install -g rendertron
# lancer le serveur
rendertron
# le serveur rendertron se lance sur le port 3000, http://localhost:3000

Utilisation

  • http://localhost:3000/render/<url-to-render>,

url-to-render est a remplacer par l’URL de votre application en local.

En suivant cette URL rendertron devrait rendre le site local Angular sérialisé avec un code source exploitable pour l’indexation.

Exemple avec mon application Angular qui tourne sur l’URL http://localhost:8100

http://localhost:3000/render/http://localhost:8100/

Installer & lancer ngrok

(Windows) dézipper l’archive, copier le fichier ngrok.exe dans C:\Program Files\ngrok Ajouter C:\Program Files\ngrok à votre PATH.

Obtenir une URL ngrok qui va exposer votre serveur local sur internet

ngrok http 3000
# ngrok génère alors une URL mappé sur le port 3000 de votre localhost

http://<id-ngrok>.ngrok.io/render/<http://localhost:8100/<path-a-analyser/>>

Analyser la page avec un outil SEO en ligne

  • Par exemple : dareboost.com taper l’URL dans l’outil : http://<ID ngrok>.ngrok.io/render/http://localhost:8100/

Analyser les micro data avec l’outil de test des

données structurées

Dans l’onglet “explorer l’url” taper votre address ngrok. Exemple : http://<id-ngrok>.ngrok.io/render/http://localhost:8100/annuaire/entreprise-1

Utiliser l’outil de prévisualisation

Dans l’outil de test des données structurées. Cliquer sur les items détectés puis sur prévisualiser. On peut alors voir comment la page s’affichera dans le SERP.