我知道可以使用诸如wgetcurl之类的工具从命令行执行HTTP请求,或者使用来自各种编程语言的HTTP客户端请求。这些工具还支持获取HTML代码中引用的图像或其他文件。

我要寻找的是一种机制,该机制还可以执行该网页的JavaScript,从而将图像呈现到HTML画布中。然后,我想将该渲染图像提取为图像文件。要达到的目标是获取这些图像的时间序列,例如通过cron作业将时变数据绘制到恒定DOM对象中的气象图或其他图表。

我更喜欢从脚本工作的解决方案。怎么办呢?

最佳答案

您可以使用puppeteer将页面加载到无头Chrome实例中


打开页面并等待其加载
使用page.evaluate返回画布的dataUrl
将dataUrl转换为缓冲区并将结果写入文件




const puppeteer = require('puppeteer');
    const fs = require('fs');

    (async () => {
        const browser = await puppeteer.launch();
        const page = await browser.newPage();
        await page.goto('https://games.novatoz.com/jigsaw-puzzle');

        const dataUrl = await page.evaluate(async () => {
            const sleep = (time) => new Promise((resolve) => setTimeout(resolve, time));

            await sleep(5000);

            return document.getElementById('canvas').toDataURL();
        });

        const data = Buffer.from(dataUrl.split(',').pop(), 'base64');

        fs.writeFileSync('image.png', data);
        await browser.close();
    })();

10-05 21:01
查看更多