Rumah  >  Artikel  >  hujung hadapan web  >  Analisis ringkas tentang cara menggunakan perpustakaan Puppeteer dalam Node.js

Analisis ringkas tentang cara menggunakan perpustakaan Puppeteer dalam Node.js

青灯夜游
青灯夜游ke hadapan
2021-12-10 18:56:413304semak imbas

Apakah perpustakaan Puppeteer? Apa yang boleh dibuat? Bagaimana untuk menggunakan Artikel berikut akan memperkenalkan anda kepada pustaka Puppeteer dan mempelajari cara menggunakan pustaka Puppeteer dalam Node.js Saya harap ia akan membantu anda!

Analisis ringkas tentang cara menggunakan perpustakaan Puppeteer dalam Node.js

Puppeteer ialah pustaka rasmi DevTools协议headless Chrome yang dihasilkan oleh Google yang mengawal Node melalui . Anda boleh mengawal terus Puppeteer melalui API yang disediakan oleh Chrome untuk mensimulasikan kebanyakan operasi pengguna ke UI Test atau melawat halaman sebagai 爬虫 untuk mengumpul data.

Dokumentasi Cina

https://zhaoqize.github.io/puppeteer-api-zh_CN/#/

Fungsi:

Apa yang boleh dilakukan?

  • Jana PDF halaman.
  • Merangkak SPA (Aplikasi Halaman Tunggal) dan menjana kandungan pra-diberikan.
  • Serahkan borang secara automatik, jalankan ujian UI, input papan kekunci, dsb.
  • Buat persekitaran ujian automatik yang sentiasa dikemas kini. Jalankan ujian terus dalam versi Chrome terkini menggunakan ciri JavaScript dan penyemak imbas terkini.
  • Tangkap jejak garis masa tapak web untuk membantu menganalisis isu prestasi.
  • Uji sambungan penyemak imbas.

Puppeteer ialah pakej npm, jadi pemasangan adalah sangat mudah:

npm i puppeteer

atau

yarn add puppeteer

Cara menggunakan:

// 引入 Puppeteer 模块
let puppeteer = require('puppeteer')

//puppeteer.launch实例化开启浏览器
async function test() {
    //可以传入一个options对象({headless: false}),可以配置为无界面浏览器,也可以配置有界面浏览器
    //无界面浏览器性能更高更快,有界面一般用于调试开发
    let options = {
        //设置视窗的宽高
        defaultViewport:{
            width:1400,
            height:800
        },
        //设置为有界面,如果为true,即为无界面
        headless:false,
        //设置放慢每个步骤的毫秒数
        slowMo:250
    }
    let browser = await puppeteer.launch(options);

    // 打来新页面
    let page = await browser.newPage();

    // 配置需要访问网址
    await page.goto('http://www.baidu.com')
    
    // 截图
    await page.screenshot({path: 'test.png'});

    //打印pdf
    await page.pdf({path: 'example.pdf', format: 'A4'});

   // 结束关闭
    await browser.close();
}test()

Analisis ringkas tentang cara menggunakan perpustakaan Puppeteer dalam Node.js

// 获取页面内容
//$$eval函数,使回调函数可以运行在浏览器中,并且可以通过浏览器的方式进行输出
    await page.$$eval('#head #s-top-left a',(res) =>{
        //console.log(res);
        res.forEach((item,index) => {
            console.log($(item).attr('href'));
        })
    })
// 监听console.log事件
page.on('console',(...args) => {
    console.log(args);
})
// 获取页面对象,添加点击事件
   ElementHandle = await page.$$('#head #s-top-left a')
   ElementHandle[0].click();

Analisis ringkas tentang cara menggunakan perpustakaan Puppeteer dalam Node.js

// 通过表单输入进行搜索
    inputBox = await page.$('#form .s_ipt_wr #kw')
    await inputBox.focus() //光标定位在输入框
    await page.keyboard.type('Node.js') //向输入框输入内容
    search = await page.$('.s_btn_wr input[type=submit]')
    search.click() //点击搜索按钮

Analisis ringkas tentang cara menggunakan perpustakaan Puppeteer dalam Node.js

Amalan crawler

Banyak halaman web menggunakan user-agent untuk menilai peranti, yang boleh disimulasikan melalui page.emulate(options) . Pilihan mempunyai dua item konfigurasi, satu ialah userAgent dan satu lagi ialah viewport Anda boleh menetapkan 宽度(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();
});

Kod di atas menyerupai iPhone6 melawat tapak web, dengan devices ialah parameter simulasi beberapa peranti biasa yang terbina dalam puppeteer.

Banyak halaman web memerlukan log masuk Terdapat dua penyelesaian:

  • Biarkan dalang memasukkan kata laluan akaun: klik untuk menggunakan kaedah page.click(selector[, options]). , Anda juga boleh memilih untuk memfokuskan halaman.fokus(pemilih). Untuk input, anda boleh menggunakan page.type(selector, text[, options]) untuk memasukkan rentetan yang ditentukan, dan anda juga boleh menetapkan kelewatan dalam pilihan untuk memasukkan secara perlahan, lebih seperti orang sebenar. Anda juga boleh menggunakan papan kekunci.bawah(kunci[, pilihan]) untuk memasukkan aksara demi aksara.
  • Jika anda menggunakan kuki untuk menentukan status log masuk, anda boleh menggunakan page.setCookie(...cookies Jika anda ingin mengekalkan kuki, anda boleh melawati dengan kerap).

Petua: Sesetengah tapak web perlu mengimbas kod, tetapi halaman web lain dengan nama domain yang sama telah dilog masuk, anda boleh cuba log masuk ke halaman web tempat anda boleh log masuk, dan menggunakan kuki untuk mengakses lompat Imbas kod.

Untuk fungsi yang lebih berkuasa, sila rujuk dokumentasi rasmi: https://zhaoqize.github.io/puppeteer-api-zh_CN/#/

Lebih banyak nod Untuk pengetahuan berkaitan, sila lawati: tutorial nodejs! !

Atas ialah kandungan terperinci Analisis ringkas tentang cara menggunakan perpustakaan Puppeteer dalam Node.js. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

Kenyataan:
Artikel ini dikembalikan pada:juejin.cn. Jika ada pelanggaran, sila hubungi admin@php.cn Padam