Nodejs puppeteer 怎么保存网页上的图片？

Nodejs puppeteer 怎么保存网页上的图片？

puppeteer 怎么保存网页上的图片？不依赖别的库，自身命令里有保存图片的命令吗？

5 回复

参考下这篇： https://intoli.com/blog/saving-images/


用拦截器拦截所有图片写本地文件呗

关键词 Chrome DevTools Protocol。
Network.getResponseBody 和 Page.captureScreenshot 这两个，理论上是应该可以的。

啥意思？
获取 img 标签的 src 不就完事了么

在Node.js中使用Puppeteer保存网页上的图片，可以通过以下步骤实现：

一、环境准备

  1. 确保已安装Node.js和npm。
  2. 使用npm安装Puppeteer：
npm install puppeteer

二、代码实现

以下是一个使用Puppeteer保存网页图片的示例代码：

const puppeteer = require('puppeteer');

(async () => {
  const browser = await puppeteer.launch();
  const page = await browser.newPage();
  await page.goto('https://example.com', { waitUntil: 'networkidle2' });

  // 等待图片加载完成
  await page.waitForSelector('img');

  // 抓取图片资源链接
  const imageSrcs = await page.evaluate(() => {
    const images = document.querySelectorAll('img');
    const srcs = Array.from(images).map(img => img.src);
    return srcs;
  });

  // 下载图片资源
  for (let src of imageSrcs) {
    const filename = src.split('/').pop();
    const path = `./images/${filename}`;
    await page.download(src, { path: path });
    console.log(`图片下载成功: ${filename}`);
  }

  await browser.close();
})();

三、注意事项

  1. 确保目标网页允许图片被下载，遵守版权和隐私权。
  2. 在实际使用中，可能需要添加异常处理和错误日志，以提高代码的健壮性。

通过以上步骤，你可以使用Puppeteer在Node.js中保存网页上的图片。

回到顶部