如何通过puppetter实现PDF聚合阅读器初始模型以及产品思维构想

什么是puppeteer？

---

行业中puppeteer被称为傀儡师，又被称为提线木偶，它是一个 Node 库，它提供了一个高级 API 来通过 DevTools 协议 控制 Chrome 或 Chromium 。Puppeteer 默认运行 无头 ，但可以配置为运行完整（非无头）Chrome 或 Chromium。

puppeteer可以做什么？

---

• 生成页面的屏幕截图和 PDF。
• 抓取 SPA（单页应用程序）并生成预渲染内容（即“SSR”（服务器端渲染））。
• 自动化表单提交、UI 测试、键盘输入等。
• 创建最新的自动化测试环境。使用最新的 JavaScript 和浏览器功能直接在最新版本的 Chrome 中运行测试。
• 捕获您网站的 时间线轨迹 以帮助诊断性能问题。
• 测试 Chrome 扩展程序。

puppeteer和selenium的主要区别？

---

• puppeteer是谷歌孵化出来的一个 Node.js 库和浏览器测试框架对geogle浏览器访问权限较好，它主要针对geogle浏览器和它同胞小弟Chromium浏览器、而selenium是有Thoughtworks公司在2004 年推出的。
• puppeteer开发语言主要是JavaScript、而selenium支持 JavaScript、Java、Ruby、C# 和 Python。为了更好的体现python语言的万金油的作用、非官方版本的puppetter应运而生。
• 从易用性来说如果对JavaScript有所了解的话，选择puppeteer还是比较好的。当然如果对python语言比较熟悉、像构建完善的自动化工程还是选择selenium。

语言特性和实现

---

• nodeJs

/*
 * @Author: syx1990 [email protected]
 * @Date: 2022-08-16 22:08:40
 * @LastEditors: syx1990 [email protected]
 * @LastEditTime: 2022-08-17 22:18:38
 * @FilePath: /puppeteer/webCrawl.js
 * @Description: 基础使用
 */
const puppetter = require('puppeteer');

(async()=>{
    
    
    try {
    
    
        const browser = await puppetter.launch({
    
    
            headless: true,
            slowMo: 100, // slow down by 100ms 
        });
        const page = await browser.newPage(); 
        await page.goto('http://www.netearn.top/');  // 进入博客首页
        delay(2000); // 2秒进入全屏截图
        console.log("2秒进入全屏截图");
        await page.screenshot({
    
    path:"./theme/rainNight.png",fullPage: true}); // 截图
        delay(4000); // 4秒进入检索“python”字段的内容
        console.log("4秒进入检索“python”字段的内容");
        await page.focus('#keywords');
        await page.type('#keywords','python');
        await page.click('#searchsubmit');
        delay(5000); // 5秒后生成PDF
        console.log("5秒后生成截图和PDF");
        await page.screenshot({
    
    path:"./theme/rainNight-python.png",fullPage: true}); // 截图
        await page.pdf({
    
    path:"./theme/rainNight.pdf",format:"A4",printBackground:true}) // 保存成pdf，必须是无头浏览器才可以
        delay(5000); // 5秒后关闭浏览器
        console.log("5秒后关闭浏览器");
        await browser.close();   
    } catch (error) {
    
    
        console.log(`this is the ${
      
      error}`);
    }
})();

// 设置间歇时间
function delay(time) {
    
    
    let curtime = new Date().getTime();
    time += curtime;
    while(curtime < time) {
    
    
        curtime = new Date().getTime();
    } 
}

• python3

# -*- coding: utf-8 -*-
# !/usr/bin/python3
# author by : yuxiangShi
# tell  by: 18538187569

import asyncio # 异步协程库
from pyppeteer import launch
import random
import logging 


async def Run():
    browser = await launch({
    
    'headless': True, "slowMo": 100})  # slow down by 100ms
    randoms = random.randrange(3, 10)
    try:
        page = await browser.newPage()
        await page.goto("http://www.netearn.top/", timeout=10000000)
        await asyncio.sleep(randoms)
        print("2秒进入全屏截图")
        logging.info("2秒进入全屏截图")
        await page.screenshot({
    
    "path": "./theme/rainNight.png", "fullPage": True})
        await asyncio.sleep(randoms)
        print("4秒进入检索“python”字段的内容")
        logging.info("4秒进入检索“python”字段的内容")
        await page.focus('#keywords')
        await page.type('#keywords', 'python')
        await page.click('#searchsubmit')
        await asyncio.sleep(randoms)
        print("5秒后生成截图和PDF")
        logging.info("5秒后生成截图和PD")
        await page.screenshot({
    
    "path": "./theme/rainNight-python.png", "fullPage": True})  # 截图
        await page.pdf({
    
    "path": "./theme/rainNight.pdf", "format": "A4", "printBackground": True})  # 保存成pdf，必须是无头浏览器才可以
        await asyncio.sleep(randoms)  # 5秒后关闭浏览器
        print("5秒后关闭浏览器")
        logging.info("5秒后关闭浏览器")
    finally:
        await browser.close()


if __name__ == "__main__":
    # 日志模块
    logging.basicConfig(filename='./Log/error.log', level=logging.DEBUG)
    asyncio.get_event_loop().run_until_complete(Run())

沧桑巨变、史诗为进

---

Pdf的处理对于现在场景分析中、是必须常见的、目前国际或者国内做PDF聚合阅读和处理的平台到是不多、中国老牌的福昕阅读器和海外同类的PDF Reader Pro市场都是在阅读上，但是在pdf合并和处理上并没有什么好的平台得以应用、要么收费、要么按次收费。当然今天不讨论这个问题，只是为了写个PDF聚合采集工具。

nodeJs

/*
 * @Author: syx1990 [email protected]
 * @Date: 2022-08-18 00:20:46
 * @LastEditors: syx1990 [email protected]
 * @LastEditTime: 2022-08-18 21:59:48
 * @FilePath: /puppeteer/readerCrawl.js
 * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
 */

const puppeteer = require('puppeteer');

(async()=>{
    
    
    try {
    
    
        const browser = await puppeteer.launch({
    
    
            headless: true,
            slowMo: 100, // slow down by 100ms 
        });
        const page = await browser.newPage();
        await page.goto("http://educate.netearn.top/educate/detail/20/6/29");
        delay(2000); // 2秒进入全屏截图
        let aTags = await(await page).evaluate(()=>{
    
    
            let as = [...document.querySelectorAll('.catalog-body ul li a')];
            return as.map((a) =>{
    
       
                return {
    
    
                  href: a.href.trim(),
                  name: a.text
                }
            });
    });

    lenght = (aTags.length - aTags.length) + 3

    console.log("总个数："+lenght);

    for (var i = 1; i <= lenght;i++){
    
    
        pageS = await browser.newPage();
        var a = aTags[i];                  
        await pageS.goto(a.href,{
    
    'timeout': 0});      
        await pageS.pdf({
    
    path: `./polymerization/${
      
      a.name}-${
      
      i}.pdf`,format:'a4'});
        await pageS.close();
        console.log("完成个数："+i);
        console.log("下载标题："+a.name);
    } 
    console.log("5秒后关闭浏览器");
     await browser.close();
    } catch (error) {
    
    
        console.log(`this is the ${
      
      error}`);
    }
})();

// 设置间歇时间
function delay(time) {
    
    
    let curtime = new Date().getTime();
    time += curtime;
    while(curtime < time) {
    
     
        curtime = new Date().getTime();
    } 
}

这是一个简单的产品原型、后期可以加入PDF合并、拆分以及PDF转成图片、图片转PDF、视频格式转换等工具类的工具平台。

思维和共识

---