puppeteer demo解析

393 阅读1分钟

demo来源:github.com/laispace/pu…

/**
 * 在无头浏览器中将一个网页截图保存为图片
 */

const puppeteer = require('puppeteer');

const saveScreenshot = async (url, path) => {

    // 启动浏览器
    const browser = await puppeteer.launch();
    // 打开页面
    const page = await browser.newPage();
    // 设置浏览器视窗
    page.setViewport({
        width: 1376,
        height: 768,
    });
    // 地址栏输入网页地址
    await page.goto(url);
    // 截图: https://github.com/GoogleChrome/puppeteer/blob/master/docs/api.md#pagescreenshotoptions
    await page.screenshot({ path });
    // 关闭浏览器
    await browser.close();
};

module.exports = saveScreenshot;


if (require.main === module) {
    // for test
    saveScreenshot('http://google.com', './google.png');
}

1. const

const是JavaScript的关键字,他用于声明一个或者多个常量,声明时必须进行初始化,且初始化后值不可再修改

2. require

require()是一个全局性方法,用于加载模块。如require('puppeteer')是加载了puppeteer.js模块,以便后续调用该模块的方法

3. async与await

async是表示异步。await其实是async wait,表示异步等待。在应用上,async用来表明方法是异步的,await用来等待异步方法执行完成。await只能出现在async函数中,出现在普通函数中是会报错的。async会将他后面的函数/函数表达式/lambda的返回值封装成一个Promise对象,await会等待这个Promise完成,并将其resolve的结果返回出来

4. launch()方法

puppeteer的launch方法用于生成一个browser的实例。可以在launch方法中传入配置项,如headless,来关闭headless模式。如,puppeteer.launch({headless:false})

5. newPage()方法

browser.newPage方法用于打开一个新选项卡并返回选项卡的实例page。再通过page的各种方法对页面进行进一步操作