puppeteer新手入门(chromium下载跳坑)

时间：2021-02-07 20:07:57

from：https://www.jianshu.com/p/a89d8d6c007b

 

 
 
 
  
 
   
puppeteer简介
 
   
puppeteer 翻译是操纵木偶的人，利用这个工具，我们能做一个操纵页面的人。puppeteer是一个nodejs的库，支持调用Chrome的API来操纵Web，相比较Selenium或是PhantomJs,它最大的特点就是它的操作Dom可以完全在内存中进行模拟既在V8引擎中处理而不打开浏览器，而且关键是这个是Chrome团队在维护，会拥有更好的兼容性和前景。
 
   
puppeteer功能
 
   
    

  • 生成页面的截图和PDF。
    •  
    
  • 抓取SPA并生成预先呈现的内容（即“SSR”）。
    •  
    
  • 从网站抓取你需要的内容。
    •  
    
  • 自动表单提交，UI测试，键盘输入等
    •  
    
  • 创建一个最新的自动化测试环境。使用最新的JavaScript和浏览器功能，直接在最新版本的Chrome中运行测试。
    •  
    
  • 捕获您的网站的时间线跟踪，以帮助诊断性能问题。
    •  
   


puppeteer轻松入门
 
   
1. 环境和安装
 
   
Puppeteer 至少需要 Node v6.4.0，如要使用 async / await，只有 Node v7.6.0 或更高版本才支持。 node下载地址： https://nodejs.org/zh-cn/
 
   
2. 创建项目
 
   
2.1 创建test目录，进入目录执行npm init
 
   
2.2 安装 puppeteer
 
   
yarn add puppeteer 或者 npm i puppeteer
 
   
可能会出现以下报错:
 
   
ERROR: Failed to download Chromium r515411! Set "PUPPETEER_SKIP_CHROMIUM_DOWNLOAD" env variable to skip download.
 
   
是因为在执行安装的过程中需要执行install.js，这里会下载Chromium,官网建议是进行跳过，我们可以执行 —ignore-scripts 忽略这个js执行。也可以通过设置环境变量set PUPPETEER_SKIP_CHROMIUM_DOWNLOAD=1阻止下载 Chromium （因为封网，直接下载会失败）
 
   
npm i --save puppeteer --ignore-scripts
 
   
2.3 手动下载Chromium
 
   
下载地址：https://download-chromium.appspot.com/ (打开蓝灯*软件...)
 
   
把下载刚刚下载的文件解压出来会有chrome-win32文件夹，把里面的文件拷贝到项目新建的chromium文件夹中
 
   
2.4 新建index.js（截图功能）, 代码如下：
 
   
const puppeteer = require('puppeteer');(async () => {    const browser = await puppeteer.launch();    const page = await browser.newPage();    await page.goto('https://y.qq.com');    await page.screenshot({path: 'yqq.png'});    browser.close();})();
 
   
打开cmd执行index.js
 
   
node index.js
 
   
这时候可能出现以下错误：
 
   
(node:8672) UnhandledPromiseRejectionWarning: Unhandled promise rejection (rejection id: 1): AssertionError [ERR_ASSERTION]: Chromium revision is not downloaded. Run "npm install"(node:8672) [DEP0018] DeprecationWarning: Unhandled promise rejections are deprecated. In the future, promise rejections that are not handled will terminate the Node.js process with a non-zero exit code.
 
   
显示chromium 未下载错误，因为chromium默认的下载路径是在node_modules/puppeteer/.local-chromium/目录，这时候我们的chromium是在项目根目录，所以需要配置指定路径，修改index.js文件()：
 
   
const puppeteer = require('puppeteer');(async () => {      const browser = await puppeteer.launch({        executablePath: './chromium/chrome.exe',        headless: false      });      const page = await browser.newPage();      await page.goto('http://music.163.com/');      await page.screenshot({path: 'music.png'});      browser.close();})();
 
   
puppeteer launch参数说明：
 
   
    

  • executablePath： 运行Chromium或Chrome可执行文件的路径
    •  
    
  • headless： 是否运行在浏览器headless模式，true为不打开浏览器执行，默认为true
    •  
    
  • timeout： 等待浏览器实例启动的最长时间（以毫秒为单位）。默认为30000（30秒）。通过0禁用超时
    •  
    
  • args： 传递给浏览器实例的其他参数
    •  
   


更多参数请参照官网，再次执行index.js可能出现以下错误：
 
   
Error: Protocol error (Page.getFrameTree): 'Page.getFrameTree' wasn 't found undefined
 
   
刚开始找了好久没找到答案，然后上万能的Google找了下，发现了类似的问题
 
   
 
    
 
      
     
 
      puppeteer新手入门(chromium下载跳坑)

 
    
 
    

      image.png 
    
 
   
 
   
可能是chromium的版本存在差异，然后重新在chromium官网下载最新版本解压到项目（要注意下相应系统chromium）
 
   
执行index.js， 脚本运行chromium浏览器跳转到界面，截图保存到项目中，这样就成功了...
 
   
2.5 puppeteer相关地址
 
   
puppeteer神器官方文档，可以进行其他强大的功能开发...
 
  
 
 
 
 
 
  
小礼物走一走，来简书关注我
 
 
 





作者：ppCode 

链接：https://www.jianshu.com/p/a89d8d6c007b 

來源：简书 

著作权归作者所有。商业转载请联系作者获得授权，非商业转载请注明出处。 

标签：
相关文章