我想使用Nodejs和puppeteer将网页保存下来以便离线使用。我看到很多例子都是这样做的:
await page.screenshot({path: 'example.png'});
但对于较大的网页来说,这并不是一个选项。因此,在puppeteer中更好的选择是加载页面,然后保存为:
const html = await page.content();
// ... write to file
好的,没问题。现在我要像Twitter一样滚动页面。因此,我决定在Puppeteer页面中阻止所有图像:
page.on('request', request => {
if (request.resourceType() === 'image') {
const imgUrl = request.url()
download(imgUrl, 'download').then((output) => {
images.push({url: output.url, filename: output.filename})
}).catch((err) => {
console.log(err)
})
request.abort()
} else {
request.continue()
}
})
好的,我现在使用了“npm download”库来下载所有图片。是的,下载的图片都很好:D。
现在当我保存内容时,我想将其指向源中的离线图片。
const html = await page.content();
但现在我想要替换所有的 标签为 标签。
<img src="/pic.png?id=123">
<img src="https://twitter.com/pics/1.png">
并且还有像这样的事情:
<div style="background-image: url('this_also.gif')></div>
在Puppeteer中有没有一种方法可以爬取一个大页面并将整个内容离线存储?同时包括Javascript和CSS。
更新
目前我将再次使用Puppeteer打开大的HTML文件。
然后拦截所有文件,如: https://dom.com/img/img.jpg,/file.jpg,....
request.respond({
status: 200,
contentType: 'image/jpeg',
body: '..'
});
我也可以使用Chrome扩展程序来完成这项任务。但是,我希望能够在选项页面中添加一些功能,类似于page.pdf()的功能。