Générez automatiquement des captures d'écran de pages Web à l'aide de l'interface API de capture d'écran de pages Web.

Contexte

Récemment, je développe un petit programme, qui a un module d'aide avec une liste d'articles d'aide, et le contenu de l'article est édité en texte enrichi par le format d'arrière-plan du site Web. Compte tenu de la particularité de l'applet, son support du texte enrichi au format HTML n'est pas convivial.

Au début, quelqu'un a développé le plug-in wxparse, puis WeChat a fourni le composant de texte enrichi, mais il y a eu quelques problèmes avec les deux.

Idées

Une fois les styles d'articles modifiés en arrière-plan affichés par les composants wxparse ou richtext, il existe des problèmes de compatibilité. Si nous transformons le contenu de l'article en image et que nous utilisons ensuite l'image pour l'afficher, nous devrions être en mesure d'obtenir un effet plus idéal.

Mais pour chaque article, il est long et laborieux d'aller dans le domaine de l'art pour concevoir une image, et il est également laborieux de la modifier.

Ce serait parfait si l'article que nous avons édité en arrière-plan pouvait générer automatiquement une image.

Solution

Après interrogation, nous avons constaté que le site Web étranger thumb.io fournit un service similaire et que vous pouvez utiliser l'interface API pour enregistrer l'adresse spécifiée sous forme d'image. Cependant, après des tests, il a été constaté que l’image n’était pas claire et que la vitesse d’accès était très lente. Ensuite, j'ai installé phantomjs moi-même et je l'ai testé, et l'effet était idéal.

Capture d'écran de la page d'accueil de Baidu enregistrée avec phantomjs

Afin de réaliser l'automatisation, j'ai également créé une API Web. Les captures d'écran peuvent être générées automatiquement (de manière asynchrone) en envoyant l'URL de l'article correspondant à l'API spécifiée. La méthode spécifique consiste à enregistrer la demande dans la base de données lorsqu'il y a une demande de capture d'écran, puis à exécuter un programme sur le serveur pour effectuer les opérations de capture d'écran une par une et à modifier l'état de la demande correspondante après avoir pris la capture d'écran.

------------------------------------------------------ --- --------

Interface API (le contenu dans {} est la valeur du paramètre)

Utilisation : Une capture d'écran sera requise. L'URL est transmise à l'interface de demande de capture d'écran. Après un certain temps (10 secondes sont recommandées), l'interface de requête est interrogée. Si le code renvoyé = 0, statut = 1, enregistrez simplement la vignette localement.

Générer une demande de capture d'écran : http://thumb.loxn.cn/?url={URL}

　Remarque : les paramètres d'URL doivent être saisi le code urlen, sinon des erreurs peuvent survenir

Exemple : http://thumb.loxn.cn/?url=http%3a%2f%2fwww.cnblogs.com%2fdragondean%2f

Retour : Format JSON

　　　　　code　　0 Succès, 　　　 Erreur de format URL, 　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　 nous présente dans le format de l'URL. '' 　　 L'URL existe déjà

　 Message d'erreur (uniquement si le code n'est pas 0 , il existe)

　　　 Task_id　 ID de tâche, état de la requête Il est nécessaire lors de l'interrogation de la clé secrète (lorsque le code est 0 ou 2)

Il est nécessaire lors de l'interrogation de l'état (lorsque le code est 0 ou 2)

Statut Statut de la tâche, si la tâche a été Si elle existe, ce statut sera renvoyé -1 signifie échec, 0 signifie traitement, 1 signifie terminé

thumb　 adresse de capture d'écran, vous pouvez directement télécharger cette image en local (lorsque le code est 2 et le statut est 1)

　　　　 err_msg　Message d'erreur, n'existe que lorsque status=-1

Requête statut de la tâche : http://thumb.loxn.cn/?a=query&task_id={TASK_ID} &key={KEY}

　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　les uigatemies sont renvoyées lors de la génération d'une requête et sont obligatoires

`` eb8578633e5cb22377ee85641204494f

Retour : code JSON

Statut de retour, 0 succès, 3 tâches n'existent pas, 4 erreur de clé de requête

le code d'état est Quand 0, statut =-1 signifie Échec, status=0 signifie traitement, status=1 signifie terminé

　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　 apport en nous en nous en en... L'information n'existe que lorsque le statut = -1

-- -------------------------------- ------------------

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!