Maison > interface Web > js tutoriel > Node Puppeteer implémente le partage d'idées de surveillance des connexions sur des sites Web

Node Puppeteer implémente le partage d'idées de surveillance des connexions sur des sites Web

php中世界最好的语言
Libérer: 2018-05-30 15:24:36
original
2120 Les gens l'ont consulté

Cette fois, je vais partager avec vous des idées pour mettre en œuvre la surveillance des connexions à un site Web avec Node Puppeteer. Quelles sont les précautions pour mettre en œuvre la surveillance des connexions à un site Web avec Node Puppeteer. Voici des cas pratiques, jetons un coup d'œil.

Introduction à Puppeteer

Puppeteer est une bibliothèque de nœuds développée par l'équipe Chrome, qui peut contrôler les comportements du navigateur, tels que les clics et les sauts, via les API Transférer, actualiser, exécuter des scripts js dans la console, etc. Avec cet artefact, il est facile d'écrire un robot d'exploration, de se connecter automatiquement, de prendre des captures d'écran de pages Web, de générer des PDF et d'automatiser les tests.

Un exemple simple de marionnettiste

Le code vient du site officiel :

const puppeteer = require('puppeteer');
(async () => {
 const browser = await puppeteer.launch();//打开浏览器
 const page = await browser.newPage();//打开一个空白页
 await page.goto('https://example.com');//在地址栏输入网址并等待加载
 await page.screenshot({path: 'example.png'});//截个图
 await browser.close();//关掉浏览器
})();
Copier après la connexion

Lecture du code ci-dessus , on peut constater que 1 , Chaque étape du code est une opération asynchrone, 2. Chaque opération correspond à un comportement réel d'utilisation du navigateur. Comprendre ces deux points est d'une grande aide pour utiliser cette bibliothèque. De plus, les deux objets les plus couramment utilisés sont les objets navigateur et page. Il existe de nombreuses méthodes sur les objets utilisés pour faire fonctionner les deux objets. Ensuite, nous rédigerons une petite démo pour vous connecter au site Web.

Sites Web sans Code de vérification

Pour les sites Web sans code de vérification, entrez essentiellement le numéro de compte et entrez le mot de passe, les trois étapes consistant à cliquer pour se connecter nécessitent l'utilisation de deux méthodes de l'objet page : le type est utilisé pour saisir des informations dans la zone de saisie, et le clic est utilisé pour cliquer pour se connecter. Prenons l'exemple de la connexion à Douban :

const puppeteer = require('puppeteer');
const account = `123456@qq.com`;
const password = `123456`;
(async () => {
 const browser = await puppeteer.launch();//打开浏览器
 const page = await browser.newPage();//打开一个空白页
 await page.goto('https://www.douban.com/');//打开豆瓣网站
 await page.type('#form_email', account);  
 await page.type('#form_password', password);
 await page.click('.bn-submit');
 await page.waitForNavigation({
  waitUntil: 'load'
 });//等待页面加载出来,等同于window.onload
 await page.screenshot({path: 'example.png'});//截个图
 await browser.close();//关掉浏览器
})();
Copier après la connexion

Certaines personnes demandent : comment puis-je savoir si la connexion a réussi ? Une façon de déboguer est d'utiliser des captures d'écran si ce que vous voyez est une page de codes de vérification ? , indiquant que la connexion n'a pas réussi, il existe une autre méthode comme la suivante :

const browser = await puppeteer.launch({headless: false});//打开有界面的浏览器
Copier après la connexion

Passer en headless: false ouvrira en fait une interface de navigateur, afin que vous puissiez voir l'exécution du code en temps réel quelque part . Parlons ensuite de ce qu'il faut faire lorsque vous rencontrez un code de vérification.

Sites Web avec codes de vérification

Lorsque vous rencontrez des sites Web avec des codes de vérification, vous pouvez définir headless sur faux, utiliser l'interface pour saisir le code de vérification et surveiller la page en même temps Événement de chargement implémente la connexion. Le code est le suivant :

...
 await page.waitForNavigation({
  waitUntil: 'load'
 });//等待页面加载出来,等同于window.onload
//代码中监听跳转事件
if(page.url() === 'https://www.douban.com/accounts/login'){ 
   //登录不成功
  console.log('需要输入验证码');
  //等待再一次跳转
  while(true){
    await page.waitForNavigation({
      waitUntil: 'load'
    })
    console.log(page.url())
    if(page.url() === 'https://www.douban.com/'){
      console.log('登录成功');
      break;
    }
  }
 }
Copier après la connexion

L'idée générale est d'écrire une boucle et de surveiller en permanence les sauts de page jusqu'à ce que le navigateur passe à la page d'accueil après une connexion réussie.

Je pense que vous maîtrisez la méthode après avoir lu le cas dans cet article. Pour des informations plus intéressantes, veuillez prêter attention aux autres articles connexes sur le site Web chinois de php !

Lecture recommandée :

Comment utiliser JS pour implémenter la fonction de validation des nombres saisis et de conservation des décimales

jQuery pour implémenter la zone de texte de la page HTML Requête de correspondance floue (avec code)

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!

Étiquettes associées:
source:php.cn
Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal