rendertron
3.1.0
Veuillez noter que ce projet est obsolète . Le rendu dynamique n'est pas une approche recommandée et il existe de meilleures approches pour le rendu sur le Web.
Rendertron ne sera pas activement maintenu à ce stade.
Rendertron est une solution de rendu Chrome sans tête conçue pour rendre et sérialiser les pages Web à la volée.
Rendertron est conçu pour permettre à votre application Web progressive (PWA) de servir le contenu correct à n'importe quel bot qui ne rend ni ne rendra le JavaScript. Rendertron s'exécute en tant que serveur HTTP autonome. Rendertron rend des pages demandées à l'aide de chrome sans tête, détectant automatiquement lorsque votre PWA a terminé le chargement et sérialise la réponse à la demande d'origine. Pour utiliser Rendertron, votre application configure du middleware pour déterminer s'il faut proxy d'une demande de Rendertron. Rendertron est compatible avec toutes les technologies côté client, y compris les composants Web.
Une fois que vous avez le service opérationnel, vous devrez implémenter la couche de service différentielle. Cela vérifie l'agent utilisateur pour déterminer si la prétention est requise.
Il s'agit d'une liste de middleware disponibles à utiliser avec le service Rendertron:
Rendertron est également compatible avec prerender.io middleware. Remarque: les listes d'agents utilisateur y diffèrent.
GET /render/<url>
Le point de terminaison render rendra votre page et sérialisera votre page. Les options sont spécifiées sous forme de paramètres de requête:
mobile sont false . Activer en passant ?mobile pour demander la version mobile de votre site.refreshCache : Passez refreshCache=true pour ignorer les résultats de rendu potentiellement mis en cache et traiter la demande comme si elle n'était pas encore mise en cache. Le nouveau résultat de rendu est utilisé pour remplacer le résultat précédent. GET /screenshot/<url>
POST /screenshot/<url>
Le point de terminaison screenshot peut être utilisé pour vérifier que votre page est correctement rendu.
Les deux points de terminaison prennent en charge les paramètres de requête suivants:
width par défaut est à 1000 - Spécifie la largeur de la fenêtre.height par défaut est à 1000 - Spécifie la hauteur de la fenêtre.mobile sont false . Activer en passant ?mobile pour demander la version mobile de votre site.timezoneId - Spécifie le rendu du fuseau horaire. Des options supplémentaires sont disponibles en tant que chaîne JSON dans le corps POST . Voir la documentation des marionnettistes pour les options disponibles. Vous ne pouvez pas spécifier les paramètres type (par défaut à jpeg ) et encoding (par défaut en binary ).
GET /invalidate/<url>
Le point de terminaison invalidate supprimera le cache entré pour <url> du cache configuré (en mémoire, système de fichiers ou cloud).
Lorsque vous définissez les paramètres de requête dans le cadre de votre URL, assurez-vous qu'ils sont codés correctement. Dans JS, ce serait encodeURIComponent(myURLWithParams) . Par exemple pour spécifier page=home :
https://render-tron.appspot.com/render/http://my.domain/%3Fpage%3Dhome
Le service tente de détecter quand une page s'est chargée en regardant l'événement de chargement de page, en s'assurant qu'il n'y a pas de demandes réseau exceptionnelles et que la page a eu suffisamment de temps pour rendre.
Il y a une limite difficile de 10 secondes pour le rendu. Assurez-vous de ne pas atteindre ce budget en vous assurant que votre demande est rendue bien avant l'expiration du budget.
Chrome sans tête prend en charge les composants Web, mais Shadow Dom est difficile à sérialiser efficacement. En tant que tel, Shady Dom (une cale légère pour Shadow Dom) est requise pour les composants Web.
Si vous utilisez des composants Web V0 (dépréciés), vous devrez permettre à Shady Dom de rendre correctement. Dans Polymer 1.x, qui utilise les composants Web V0, Shady Dom est activé par défaut. Si vous utilisez Shadow Dom, remplacez-le en définissant le paramètre de requête dom=shady lors de la réalisation de demandes vers le service Rendertron.
Si vous utilisez des composants Web V1 et webcomponents-lite.js ou webcomponents-loader.js , définissez le paramètre de requête wc-inject-shadydom=true lors de la réalisation de demandes sur le service Rendertron. Ce service de rendu obligera les polyfills nécessaires à charger et à activer.
Les codes d'état de l'URL demandés initiaux sont conservés. S'il s'agit d'un 200 ou 304, vous pouvez définir l'état HTTP renvoyé par le service de rendu en ajoutant une balise Meta.
< meta name =" render:status_code " content =" 404 " /> Pour installer Rendertron et l'exécuter localement, installez d'abord Rendertron:
npm install -g rendertronAvec Chrome installé sur votre machine, exécutez la CLI Rendertron:
rendertronDépend des clones et installer:
git clone https://github.com/GoogleChrome/rendertron.git
cd rendertron
npm install
npm run buildAvec une instance locale de Chrome installée, vous pouvez démarrer le serveur localement:
npm run start gcloud app deploy app.yaml --project <your-project-id>
Rendertron n'inclut plus un fichier docker. Au lieu de cela, reportez-vous à la documentation des marionnettes sur la façon de déployer Run Headless Chrome dans Docker.
Lors du déploiement du service, définissez les variables de configuration en incluant une config.json dans la racine. Options de configuration disponibles:
timeout Default 10000 - Définissez le délai d'expiration utilisé pour rendre la page cible.port Default 3000 - Définissez le port à utiliser pour l'exécution et l'écoute du service Rendertron. Remarque Si process.env.port est défini, il sera utilisé à la place.host par défaut 0.0.0.0 - Définissez le nom d'hôte à utiliser pour l'exécution et l'écoute du service Rendertron. Remarque Si Process.env.host est défini, il sera utilisé à la place.width par défaut 1000 - Définissez la largeur (résolution) à utiliser pour rendre la page.height par défaut 1000 - Définissez la hauteur (résolution) à utiliser pour rendre la page.reqHeaders default {} - Définissez les en-têtes HTTP supplémentaires à envoyer à la page cible avec chaque demande.cache par défaut null - Défini sur datastore pour activer la mise en cache sur Google Cloud à l'aide de Datastore Utiliser uniquement si le déploiement sur Google Cloud , memory pour permettre la mise en cache ou filesystem en mémoire pour permettre la mise en cache basée sur le disquecacheConfig - un tableau d'objets pour spécifier des options de mise en cacherenderOnly - restreignez le point de terminaison à uniquement des demandes de service pour certains domaines. Spécifié comme un tableau de chaînes. par exemple, par exemple ['http://render.only.this.domain'] . Il s'agit d'une correspondance préfixe stricte, alors assurez-vous de spécifier les protocoles exacts qui seront utilisés (par exemple HTTP, HTTPS).closeBrowser par défaut false - true force le navigateur à fermer et à rouvrir entre chaque rendu de page, certains sites pourraient en avoir besoin pour empêcher les URL après les premières réponses Null Retour Null.restrictedUrlPattern par défaut null - Définissez le modélisation de restriction de restriction pour restreindre la correspondance des demandes étant donné le modèle regex. cacheDurationMinutes par défaut 1440 - Définissez un temps d'expiration dans les mines, par défaut à 24 heures. Réglé sur -1 pour désactiver l'expiration du cachecacheMaxEntries par défaut 100 - Définissez le nombre maximum d'entrées stockées dans la méthode de cache sélectionnée. Réglé sur -1 pour permettre une mise en cache illimitée. Si vous utilisez la méthode de mise en cache de carreaux de données, le réglage de cette valeur supérieure à 1000 peut entraîner des performances dégradées car la requête pour déterminer la taille du cache peut être trop lente. Si vous souhaitez autoriser un cache plus grand dans datastore , envisagez de définir ceci sur -1 et de gérer la taille de votre plate-forme à l'aide d'une méthode comme celle-ci supprimant les entrées en vracsnapshotDir Default <your os's default tmp dir>/renderton par défaut de votre système d'exploit Un exemple de fichier de configuration spécifiant un cache de mémoire, avec une expiration de 2 heures et un maximum de 50 entrées
{
"cache" : "memory" ,
"cacheConfig" : {
"cacheDurationMinutes" : 120 ,
"cacheMaxEntries" : 50
}
}Si vous avez du mal à faire fonctionner Chrome sans tête dans votre environnement, reportez-vous au guide de dépannage pour Puppeteer.
