Puppeteer教程– Puppeteer教程1和2的優秀學習指南

Puppeteer教程-Puppeteer概述

Puppeteer是使用node-js庫開發的開源Java框架。 木偶有能力作為網絡抓取工具。 就像硒Web驅動程序一樣,它也可以用作基於Web的應用程序的測試自動化。 用於測試自動化的Puppeteer的受歡迎程度正在迅速提高。 完成Puppeteer教程的先決條件是命令行,JavaScript,OOPs概念和HTML DOM結構的基礎知識。 完整的Puppeteer教程分佈在下表中提到的主題中。 

木偶教程

Tosca教程1: 木偶戲概述

托斯卡 教程 Tutorial #2: 木偶環境變量

托斯卡 教程 Tutorial #3: Puppeteer Web抓取和Puppeteer測試自動化概述

托斯卡 教程 Tutorial #4: 安裝Puppeteer 

在Puppeteer教程的這篇文章中,我們將解釋有關Puppeteer概述和Puppeteer環境變量的信息。 

木偶戲概述

Puppeteer是使用node-js庫開發的開源Java框架。 Puppeteer能夠在高級應用程序界面(API)的幫助下通過devtool協議控制Chrome瀏覽器。 Puppeteer能夠控制無頭和無頭chrome瀏覽器。 

Google引入了Puppeteer框架。 根據功能,這不是一個新概念。 但這使工作變得更容易。 從根本上講,它通過壓縮包總結了活動清單。

木偶教程-木偶
木偶教程–木偶

木偶戲如何工作?

  • Puppeteer使用Node JS庫。
  • Node JS允許使用高級API。
  • 這些API能夠通過devtool協議控制Chrome瀏覽器。
  • 默認情況下,Puppeteer可以與無頭Chrome瀏覽器一起使用,但是通過更改默認配置,它也可以與無頭Chrome瀏覽器進行交互。

Chrome DevTools協議:

使用Chrome DevTools協議,諸如Puppeteer的工具能夠檢測,檢查,調試和分析基於眨眼的瀏覽器,例如Chromium,Chrome等。

在這裡,瀏覽器的工具分為多個域,例如DOM,Debugger,Network等。每個域都解釋了所有不同的受支持命令和生成的事件。

木偶戲的特點:

  • 通過Chrome瀏覽器進行的手動過程可以實現自動化。
  • 它可以捕獲任何網頁的屏幕截圖,並生成屏幕截圖的圖像或pdf文件。
  • 可以使用Puppeteer開發服務器端渲染的單頁應用程序。
  • 它可以通過檢查點自動執行Web表單提交,UI測試,鍵盤輸入等操作。
  • 它提供了對Chrome瀏覽器的更多控制。
  • 默認的無頭模式非常快。
  • 它支持網頁抓取。
  • 能夠使用Chrome性能分析工具測量渲染和加載時間。

木偶vs木偶核心:

由於Puppeteer v1.7.0版本在每個發行版中都提供以下兩個軟件包,

  • 木偶核心程序包
  • 木偶包

木偶核心程序包:

木偶核心 是一個基於Java的Node庫,它能夠執行任何支持DevTools協議的操作。 在安裝過程中,Puppeteer內核不會下載Chromium。 作為一個庫,Puppeteer-core完全通過其編程接口來驅動。 另外,並非所有PUPPETEER_ * env變量都可以自定義Puppeteer-core的功能。 安裝Puppeteer-core的基本命令– 

npm install puppeteer-core
# or "yarn add puppeteer-core"

使用puppeteer-core時,include語句將如下所示–

const puppeteer = require('puppeteer-core')

何時使用Puppeteer-Core:

  • 要開發Puppeteer項目以通過DevTools協議使用現有的Chrome瀏覽器,而無需下載其他鉻。
  • 在DevTools協議的基礎上開發另一個最終用戶產品或庫。 例如,一個項目可能使用puppeteer-core構建屏幕截圖生成器,並編寫一個自定義setup.js腳本,該腳本下載headless_shell而不是Chromium以節省存儲空間。

木偶包:

木偶戲 是用於Chrome或Chromium瀏覽器自動化的完整產品。 在安裝過程中,它將下載最新版本的Chromium,然後由puppeteer-core驅動。 作為最終用戶產品,Puppeteer支持所有PUPPETEER_ * env變量以自定義其行為。 安裝Puppeteer的基本命令– 

npm install puppeteer
# or "yarn add puppeteer"

使用Puppeteer時,請包含如下所示的語句–

puppeteer = require(‘puppeteer’)

Puppeteer和Puppeteer-core之間的區別:

  • 在安裝過程中,Puppeteer-core不會自動下載Chromium瀏覽器。
  • Puppeteer核心不會考慮所有PUPPETEER_ * env變量。
  • 在大多數項目中,我們使用Puppeteer產品包。

無頭鉻:

無頭Chrome意味著Puppeteer正在作為後台應用程序與chrome瀏覽器進行交互,這意味著chrome UI在屏幕上不可見。 默認情況下,Puppeteer以無頭chrome啟動應用程序。 啟動Headless Chrome的代碼示例– 

在此示例中,我們將打開無頭鍍鉻,即Chrome UI將不可見。 可以通過將無頭標誌作為true傳遞給Puppeteer.launch method()來完成。

const puppeteer = require('puppeteer');

(async () => {
  const browser = await puppeteer.launch({ headless: true });
  // Specify statements for Headless Chrome operations  
  await browser.close();
})();

頭頂Chrome:

頂頭chrome表示Puppeteer正在與chrome瀏覽器進行交互,該chrome瀏覽器在屏幕上可見。 默認情況下,Puppeteer以無頭chrome啟動應用程序。 啟動Headful Chrome的代碼示例– 

在此示例中,我們將打開對我們可見的鉻。 可以通過將無頭標誌作為false傳遞給Puppeteer.launch()方法來完成。

const puppeteer = require('puppeteer');

(async () => {
  const browser = await puppeteer.launch({ headless: false});
  // Specify statements for Headless Chrome operations  
  await browser.close();
})();

木偶環境變量

Puppeteer使用預定義的環境變量來支持其操作。 如果在安裝過程中Puppeteer找不到環境變量,則將從npm config(管理NPM配置文件)中使用這些變量的小寫變體。 Puppeteer-core軟件包不考慮環境變量。 最重要的Puppeteer環境變量是– 

  • PUPPETEER_SKIP_CHROMIUM_DOWNLOAD:它指示在安裝步驟中不要下載捆綁的Chromium。
  • PUPPETEER_DOWNLOAD_HOST:它會覆蓋可用於下載Chromium的URL前綴。 
  • PUPPETEER_DOWNLOAD_PATH:它將覆蓋下載文件夾路徑。 默認路徑為–“ /.local-chromium/”,其中是puppeteer的軟件包根。
  • HTTP_PROXY,HTTPS_PROXY,NO_PROXY: 這些變量定義了在安裝過程中下載Chromium的代理設置。
  • PUPPETEER_CHROMIUM_REVISION: 它定義了木偶使用的特定版本的Chromium。
  • PUPPETEER_EXECUTABLE_PATH: 它指定在Puppeteer.launch方法中使用的可執行路徑。 
  • 木偶師_產品:它定義了Puppeteer使用哪種瀏覽器。 該值必須是chrome或firefox。 

結論:

在有關Puppeteer教程的介紹性文章中,我們了解了Puppeteer概述和Puppeteer環境變量。 在Puppeteer教程的下一篇文章中,我們將了解Puppeteer Web抓取和Puppeteer測試自動化概述。 請點擊 這裡 訪問該Puppeteer教程的參考門戶。 另外,請點擊 這裡 向LambdaGeeks學習硒。

關於 K Mondal

Puppeteer教程– Puppeteer教程1和2的優秀學習指南嗨,我是K. Mondal,我與一個領導組織有聯繫。 我有12年以上跨領域的工作經驗,例如應用程序開發,自動化測試,IT顧問。 我對學習不同的技術非常感興趣。 我在這裡實現自己的願望,目前在LambdaGeeks中擔任作者和網站開發人員。
連接到 LinkedIn- https://www.linkedin.com/in/kumaresh-mondal/

發表評論

您的電子郵件地址將不會被發表。 必填字段標 *

en English
X