• 08 【爬虫】


    08 【爬虫】

    puppeteer

    文档:puppeteer.js中文文档|puppeteerjs中文网|puppeteer爬虫教程

    Puppeteer本身依赖6.4以上的Node,但是为了异步超级好用的async/await,推荐使用7.6版本以上的Node。另外headless Chrome本身对服务器依赖的库的版本要求比较高,centos服务器依赖偏稳定,v6很难使用headless Chrome,提升依赖版本可能出现各种服务器问题(包括且不限于无法使用ssh),最好使用高版本服务器。

    Puppeteer因为是一个npm的包,所以安装很简单:

    pnpm i puppeteer-core

    puppeteer会自动安装一个谷歌浏览器的安装包,所以选择core版,但是得指定启动路径

    使用和例子

    Puppeteer类似其他框架,通过操作Browser实例来操作浏览器作出相应的反应。

    const puppeteer = require('puppeteer');
    
    (async () => {
      const browser = await puppeteer.launch();
      const page = await browser.newPage();
      await page.goto('http://rennaiqian.com');
      await page.screenshot({path: 'example.png'});
      await page.pdf({path: 'example.pdf', format: 'A4'});
      await browser.close();
    })();
    
    • 1
    • 2
    • 3
    • 4
    • 5
    • 6
    • 7
    • 8
    • 9
    • 10

    上述代码通过puppeteer的launch方法生成了一个browser的实例,对应于浏览器,launch方法可以传入配置项,比较有用的是在本地调试时传入{headless:false}可以关闭headless模式。

    const browser = await puppeteer.launch({headless:false})
    
    • 1

    browser.newPage方法可以打开一个新选项卡并返回选项卡的实例page,通过page上的各种方法可以对页面进行常用操作。上述代码就进行了截屏和打印pdf的操作。

    一个很强大的方法是page.evaluate(pageFunction, …args),可以向页面注入我们的函数,这样就有了无限可能

    const puppeteer = require('puppeteer');
    
    (async () => {
      const browser = await puppeteer.launch();
      const page = await browser.newPage();
      await page.goto('http://rennaiqian.com');
    
      // Get the "viewport" of the page, as reported by the page.
      const dimensions = await page.evaluate(() => {
        return {
          width: document.documentElement.clientWidth,
          height: document.documentElement.clientHeight,
          deviceScaleFactor: window.devicePixelRatio
        };
      });
    
      console.log('Dimensions:', dimensions);
      await browser.close();
    })();
    
    • 1
    • 2
    • 3
    • 4
    • 5
    • 6
    • 7
    • 8
    • 9
    • 10
    • 11
    • 12
    • 13
    • 14
    • 15
    • 16
    • 17
    • 18
    • 19

    需要注意的是evaluate方法中是无法直接使用外部的变量的,需要作为参数传入,想要获得执行的结果也需要return出来。因为是一个开源一个多月的项目,现在项目很活跃,所以使用时自行查找api才能保证参数、使用方法不会错。

    调试技巧

    1. 关掉无界面模式,有时查看浏览器显示的内容是很有用的。使用以下命令可以启动完整版浏览器:
    const browser = await puppeteer.launch({headless: false})
    
    • 1
    1. 减慢速度,slowMo选项以指定的毫秒减慢Puppeteer的操作。这是另一个看到发生了什么的方法:
    const browser = await puppeteer.launch({
      headless:false,
      slowMo:250
    });
    
    • 1
    • 2
    • 3
    • 4

    3.捕获console的输出,通过监听console事件。在page.evaluate里调试代码时这也很方便:

    page.on('console', msg => console.log('PAGE LOG:', ...msg.args));
    await page.evaluate(() => console.log(`url is ${location.href}`));
    
    • 1
    • 2

    爬虫实践

    很多网页通过user-agent来判断设备,可以通过page.emulate(options)来进行模拟。options有两个配置项,一个为userAgent,另一个为viewport可以设置宽度(width)、高度(height)、屏幕缩放(deviceScaleFactor)、是否是移动端(isMobile)、有无touch事件(hasTouch)。

    const puppeteer = require('puppeteer');
    const devices = require('puppeteer/DeviceDescriptors');
    const iPhone = devices['iPhone 6'];
    
    puppeteer.launch().then(async browser => {
      const page = await browser.newPage();
      await page.emulate(iPhone);
      await page.goto('https://www.example.com');
      // other actions...
      await browser.close();
    });
    
    • 1
    • 2
    • 3
    • 4
    • 5
    • 6
    • 7
    • 8
    • 9
    • 10
    • 11

    上述代码则模拟了iPhone6访问某网站,其中devices是puppeteer内置的一些常见设备的模拟参数。

    很多网页需要登录,有两种解决方案:

    1. 让puppeteer去输入账号密码 常用方法:点击可以使用page.click(selector[, options])方法,也可以选择聚焦page.focus(selector)。 输入可以使用page.type(selector, text[, options])输入指定的字符串,还可以在options中设置delay缓慢输入更像真人一些。也可以使用keyboard.down(key[, options])来一个字符一个字符的输入。
    2. 如果是通过cookie判断登录状态的可以通过page.setCookie(…cookies),想要维持cookie可以定时访问。

    Tip:有些网站需要扫码,但是相同域名的其他网页却有登录,就可以尝试去可以登录的网页登录完利用cookie访问跳过扫码。

    简单例子

    const puppeteer = require('puppeteer');
    
    (async () => {
      const browser = await puppeteer.launch({headless: false});
      const page = await browser.newPage();
      await page.goto('https://baidu.com');
      await page.type('#kw', 'puppeteer', {delay: 100});
      page.click('#su')
      await page.waitFor(1000);
      const targetLink = await page.evaluate(() => {
        return [...document.querySelectorAll('.result a')].filter(item => {
          return item.innerText && item.innerText.includes('Puppeteer的入门和实践')
        }).toString()
      });
      await page.goto(targetLink);
      await page.waitFor(1000);
      browser.close();
    })()
    
    • 1
    • 2
    • 3
    • 4
    • 5
    • 6
    • 7
    • 8
    • 9
    • 10
    • 11
    • 12
    • 13
    • 14
    • 15
    • 16
    • 17
    • 18

    爬虫

    4.1多元素处理

    const puppeteer = require('puppeteer-core');
    
    (async function () {
      //puppeteer.launch实例开启浏览器,
      //可以传入一个options对象,可以配置为无界面浏览器,也可以配置为有界面浏览器
      //无界面浏览器性能更高更快,有界面一般用于调试开式
    
      let options = {
        //设置视窗的宽高
        defaultViewport: {
          width: 1400,
          height: 800,
        },
        //设置为有界面,如果为true,即为无界面
        // headless: false,
        args: ['--window-size=1400,700'],
        //指定浏览器路径
        executablePath: 'C:\\Program Files (x86)\\Microsoft\\Edge\\Application\\msedge.exe',
      };
      let browser = await puppeteer.launch(options);
      //打开新页面
      let page = await browser.newPage();
      //访问页面
      await page.goto('https://www.jd.com/');
      //截屏
      //   await page.screenshot({ path: 'example.png', fullPage: true });
      //获取页面内容
      // page.$eval相当于querySelector,然后在对这个元素进行dom操作
      // page.$$eval相当于querySelectorAll,然后在对这个元素进行dom操作
      let input = await page.$('#key');
      await input.type('手机');
      await page.keyboard.press('Enter');
      await page.waitForSelector('.gl-warp>.gl-item:last-child');
      const lis = await page.$$eval('.gl-warp>.gl-item', els =>
        //这个el就是获取到的对象
        //这里可以使用dom操作
        // console.log(el);
        els.map(item => item.innerText)
      );
      //这个lis就是上面回调函数的返回值
      console.log(lis);
    
      //关闭浏览器
      await browser.close();
    })();
    
    
    • 1
    • 2
    • 3
    • 4
    • 5
    • 6
    • 7
    • 8
    • 9
    • 10
    • 11
    • 12
    • 13
    • 14
    • 15
    • 16
    • 17
    • 18
    • 19
    • 20
    • 21
    • 22
    • 23
    • 24
    • 25
    • 26
    • 27
    • 28
    • 29
    • 30
    • 31
    • 32
    • 33
    • 34
    • 35
    • 36
    • 37
    • 38
    • 39
    • 40
    • 41
    • 42
    • 43
    • 44
    • 45
    • 46

    4.2输入文本与元素点击

    const puppeteer = require('puppeteer-core');
    (async function () {
      let options = {
        defaultViewport: {
          width: 1400,
          height: 800,
        },
        headless: false,
        args: ['--window-size=1400,700'],
        executablePath: 'C:\\Program Files (x86)\\Microsoft\\Edge\\Application\\msedge.exe',
      };
      let browser = await puppeteer.launch(options);
      let page = await browser.newPage();
      await page.goto('https://www.ygdy8.com/index.html');
      //获取页面内容
      //  page.$相当于querySelector
      //  page.$$相当于querySelectorAll
      //这些返回的是一个elementHandle对象
      const input = await page.$('input[name="keyword"]'); // 定位输入框
      /*  1
      input.focus()
      page.keyboard.type("电影") */
      //2
      await input.type('电影');
    
      /* 1  
     elementHandle.click()
      const search = await page.$('input[name="Submit"]'); // 定位搜索按钮
      await search.click();  // 点击 */
      //2
      await page.click('input[name="Submit"]');
    })();
    
    • 1
    • 2
    • 3
    • 4
    • 5
    • 6
    • 7
    • 8
    • 9
    • 10
    • 11
    • 12
    • 13
    • 14
    • 15
    • 16
    • 17
    • 18
    • 19
    • 20
    • 21
    • 22
    • 23
    • 24
    • 25
    • 26
    • 27
    • 28
    • 29
    • 30
    • 31
    • 32

    4.3获取元素的文本值

    const puppeteer = require('puppeteer-core');
    (async function () {
      let options = {
        defaultViewport: {
          width: 1400,
          height: 700,
        },
        args: ['--window-size=1400,700'],
        headless: false,
        executablePath: 'C:\\Program Files (x86)\\Microsoft\\Edge\\Application\\msedge.exe',
      };
      let browser = await puppeteer.launch(options);
      let page = await browser.newPage();
      await page.goto('https://www.baidu.com/');
      let input = await page.waitForSelector('#kw');
      await input.type('hello world');
      let btn = await page.$('#su');
      btn.click();
      /* 等待指定的选择器匹配的元素出现在页面中,如果调用此方法时已经有匹配的元素,
      那么此方法立即返回。如果指定的选择器在超时时间后扔不出现,此方法会报错。 
      返回: >*/
      await page.waitForSelector('div#content_left > div.result-op.c-container.xpath-log');
      let text = await page.$eval(
        'div#content_left > div.result-op.c-container.xpath-log',
        el => el.innerText
      );
      console.log(text);
    })();
    
    • 1
    • 2
    • 3
    • 4
    • 5
    • 6
    • 7
    • 8
    • 9
    • 10
    • 11
    • 12
    • 13
    • 14
    • 15
    • 16
    • 17
    • 18
    • 19
    • 20
    • 21
    • 22
    • 23
    • 24
    • 25
    • 26
    • 27
    • 28

    4.4处理js方法

    const puppeteer = require('puppeteer-core');
    (async function () {
      let options = {
        defaultViewport: {
          width: 1400,
          height: 700,
        },
        args: ['--window-size=1400,700'],
        // headless: false,
        executablePath: 'C:\\Program Files (x86)\\Microsoft\\Edge\\Application\\msedge.exe',
      };
      let browser = await puppeteer.launch(options);
      let page = await browser.newPage();
      await page.goto('https://www.baidu.com/');
      let input = await page.waitForSelector('#kw');
      await input.type('hello world');
      let btn = await page.$('#su');
      btn.click();
      await page.waitForSelector('div#content_left > div.result-op.c-container.xpath-log');
      //里面可以直接写js代码
      let text = await page.evaluate(() => {
        let div = document.querySelector('div#content_left > div.result-op.c-container.xpath-log');
        return div.innerText;
      });
      console.log(text);
    })();
    
    
    • 1
    • 2
    • 3
    • 4
    • 5
    • 6
    • 7
    • 8
    • 9
    • 10
    • 11
    • 12
    • 13
    • 14
    • 15
    • 16
    • 17
    • 18
    • 19
    • 20
    • 21
    • 22
    • 23
    • 24
    • 25
    • 26
    • 27
  • 相关阅读:
    不以功利谈“感统”:拒绝焦虑,顺应养育,才能让孩子走得更远
    词向量的运算与Emoji生成器
    Python(八十八)函数的参数传递
    Eureka Series : MSVC puTTY + psFTP Dev
    Git使用详解
    javaWEB如何实现一个电影票预定购票系统javaee电影选票选座平台
    Linux网络——HTTP
    java计算机毕业设计郑工校园二手交易平台网站源代码+系统+数据库+lw文档
    Java学习笔记(十八)
    STM32 寄存器配置笔记——GPIO配置输出
  • 原文地址:https://blog.csdn.net/DSelegent/article/details/127819501