我知道可以使用诸如wget
或curl
之类的工具从命令行执行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();
})();