9
votes

Comment prendre la capture d'écran de la page HTML rendue

Notre package Web Analytics inclut des informations détaillées sur l'activité de l'utilisateur dans une page, et que nous montrons (clic / scroll / interaction) visualisations dans une superposition au-dessus de la page Web. Actuellement, il s'agit d'un iframe contenant un rendu en direct de la page.

Étant donné que les pages changent avec le temps, les données plus anciennes ne correspondent plus à la disposition actuelle de la page. Nous aimerions exécuter une araignée pour prendre occasionnellement des instantanés des pages, ce qui nous permet de conserver un enregistrement d'interactions avec diverses versions de la page.

Nous avons une implémentation de travail de cette (Linux), mais le processus d'instantané est un piratage hideux Python / JavaScript / HTML qui ouvre une fenêtre Firefox, une capture d'écran et une défilation et une réduction et une économie d'un fichier. Cela nous oblige à installer la pile X sur nos serveurs normalement sans tête et prend une minute par page.

Nous préférerions une mise en œuvre sans tête avec des performances plus proches de celui de la durée du rendu dans un navigateur Web régulier, mais n'a rien trouvé.

Il y a un certain mouvement vers la construction de quelque chose en utilisant Mozilla Source comme point de départ, mais cela me semble trop tendre, ainsi qu'un cauchemar de maintenance si nous essayons de le garder à jour.

suggestions?


1 commentaires

J'utilise wkhtmltopdf pour cela. Il a besoin d'un serveur X, mais XVFB suffit, de sorte qu'il est techniquement sans tête.


3 Réponses :


1
votes

Un article sur l'inspiration numérique < / a> points vers CutOgapt qui est multiplate-forme et utilise le moteur de rendu WebKit ainsi que IECAPT qui utilise le présent moteur de rendu actuel et nécessite Windows, Natch. Rien de loin du sommet de ma tête qui utilise Gecko, le moteur de rendu de Firefox.

Je doute que vous allez être capable de vous échapper de x, cependant. Puisque CutyCapt a besoin de qt, il nécessite une installation X ou Windows. Et, de même, IECApt nécessitera des fenêtres (ou du vin si vous souhaitez essayer de l'exécuter sous Linux, puis vous êtes de retour à la nécessité de X). Je doute que vous puissiez trouver un moteur de rendu qui ne nécessite pas Qt, GTK, GDI ou Cocoa, et nécessite donc une installation complète des bibliothèques d'affichage.


1 commentaires

@Jrockway: Je ne suis pas sûr de ce que votre antécédent est, mais je pense qu'il vous manque peut-être le point. L'objection ici n'est pas le fait qu'un écran physique soit nécessaire (ce n'est pas), mais de plus qu'une quantité massive de bibliothèques supplémentaires sont installées qui prennent en charge les interfaces graphiques sur une machine qui est autrement utilisée uniquement pour les services terminaux.



0
votes

Pourquoi ne pas stocker le HTML qui est envoyé au client? Vous pouvez ensuite utiliser cela pour redisplay dans un WebBrowser comme une page pour montrer à quoi elle ressemblait.

Utilisation de vos données WebAnalytics sur les actions d'utilisation, vous pouvez utiliser cela pour par défaut les boîtes de liste déroulantes, les champs, etc. aux valeurs que le client aurait eu, même changer le CSS sur les boutons, etc., pour les marquer comme étant poussés. < / p>

En tant que prestation, vous n'avez pas besoin de la pile X, vous n'avez pas besoin de faire ramper ou stocker des images.

EDIT (RE Andrew Moore):

Ceci est si vous stockez les CSS / images actuels sous un numéro de version. Placez un numéro de version facilement analysable dans un commentaire dans le HTML. Si vous modifiez votre CSS / images et utilisez les noms existants, incrémentez le numéro de version dans la sortie HTML envoyée.

Le système qui stocke le HTML saura savoir qu'il doit saisir une nouvelle copie et stocker sous un nouveau numéro. Lorsque Redisplaying, il utilise simplement le numéro de version pour déterminer quelle image CSS / Image à utiliser.


Nous avons actuellement un système ici qui utilise un système très similaire afin que nous puissions suivre les actions des utilisateurs et fournir un meilleur support lorsqu'ils appellent notre bureau d'assistance, car ils peuvent présenter la session des utilisateurs et suivre ce qu'ils ont fait, même de quoi vivre. < / p>

Vous pouvez même le signaler aux champs sensibles à censurer automatiquement lorsqu'il est stocké.


4 commentaires

Cela fonctionne jusqu'au jour où ils changent de mise en page et de leur CSS / images drastiquement.


Considérant votre édition. Vous avez maintenant le problème supplémentaire d'analyser les fichiers et de corriger tous les chemins de relatifs / absolus afin qu'ils s'affichent correctement. La route d'image est simplement la plus facile.


C'est correct, mais ce n'est pas si difficile. Je ne voyais pas comment rendre une page et prendre une image de, est vraiment la solution la plus simple. Au pire, vous pouvez stocker tout le CSS avec chaque session d'utilisateur et vous assurez simplement si vous modifiez une image, vous modifiez également son nom. Ou assurez-vous simplement que vous utilisiez tout via un chemin relatif en premier lieu, ce qui signifie que vous n'avez pas besoin de changer le chemin du code HTML si vous le servez correctement. Nous l'avons fait ici et mis à part certains problèmes de DB initiaux, cela fonctionne comme un charme.


La logique derrière choisir des captures d'écran sur une copie ardérée de la page, du contenu, etc., est que de nombreuses pages que nous imigrits incluent le contenu chargé par Ajax, etc. et dépendent de leurs serveurs de backend pour fournir ce contenu. Le contenu est mis à jour à peu près quotidiennement et, comme le contenu se déroule, les serveurs de backend ne le fournissent plus, il est donc impossible d'obtenir une capture d'écran précise sans l'exécuter à travers un moteur de navigateur. (Peut-être que ce n'est pas le meilleur design pour ces pages en premier lieu, mais ils sont tiers et nous sommes bloqués avec elle)



0
votes

Selon les spécificités de vos besoins, vous pouvez peut-être vous éloigner avec l'utilisation de l'une des nombreuses services de vignettes Web gratuites? SnapCasa , par exemple, vous permet de générer des milliers par mois / sans frais de publicité. (Pas jamais utilisé, il suffit de googler Service de vignette gratuit ') pour le trouver.

juste un thot


0 commentaires