puppeteer 学习笔记 (三) puppeteer实现抓取页面图片,并保存至本地

403 阅读1分钟

操作流程

  1. 打开以图找图网站
  2. 输入关键字进行查询
  3. 在搜索结果页,获取所有图片的src
  4. 通过node的文件读取,将图片保存至本地

代码

const puppeteer = require('puppeteer');
const { mn }  = require('./config/default')
const srcToimg = require('./handle/srcToimg');
(async () => {
    const broswer = await puppeteer.launch({
        headless: false,
        ignoreDefaultArgs:'--enable-automation' // 关闭提示
    })
    const page = await broswer.newPage()
    await page.goto('https://www.artmy.net/')
    await page.setViewport({
        width: 1902,
        height: 1080
    })
    await page.focus('#search_keyword')
    await page.keyboard.type('水墨画', {delay: 100})
    await page.click('.btn_search')
    await page.on('load', async()=>{
    // 获取页面所有的图片的src
        const imgsCounts = await page.$$eval('#container > div > div > a > img', imgs => imgs.map(i => i.src))
            imgsCounts.forEach(element => {
                console.log(element)
    // srcToimg方法是将src下载到本地(当前元素,下载地址)
                srcToimg(element, mn)
            });
    });
})()

保存路劲代码

const path = require('path')
module.exports = {
    mn: path.resolve(__dirname, '../../mn')
}

将src下载至本地代码

const http = require('http')
const https = require('https')
const fs = require('fs')
const path = require('path')
const { promisify } = require('util') // 处理回调问题

module.exports = async (src, dir) => {
        await urlToImg(src, dir)
}
// url => image
const urlToImg = promisify((url, dir) => {
    const mode = /^https:/.test(url) ? https : http; // 协议类型
    const ext = path.extname(url)  // 后缀
    const file = path.join(dir, `${Date.now()}${ext}`) // 文件名
// 发起请求,对返回的数据进行文件写入流
// pipe就是那根管道,
    mode.get(url, res => {
        console.log('res', res)
        res.pipe(fs.createWriteStream(file)) // 发一个流 保存到磁盘, 怎么通知完成 callback
            .on('finish', () => {
            })
    })

})

image.png