PUPPETEER概述

Puppeteer 是一個 Node 庫，它提供了一個高級 API 來通過 DevTools 協(xié)議控制 Chromium 或 Chrome。

Puppeteer 是 Google Chrome 團隊官方的無界面（Headless）Chrome 工具。正因為這個官方聲明，許多業(yè)內(nèi)自動化測試庫都已經(jīng)停止維護，包括 PhantomJS。Selenium IDE for Firefox 項目也因為缺乏維護者而終止。

puppetter可以生成頁面的截圖和PDF，抓取SSR，抓取網(wǎng)站內(nèi)容，模擬登陸等。puppetter可以做這么多少玩的事情，我開始躍躍試試，重新寫一套爬蟲。開始行動！

安裝

Puppeteer 要求使用 Node v6.4.0，但因為文中大量使用 async/await，需要 Node v7.6.0 或以上。

初始化項目

新建目錄

$ mkdir puppeteer-demo $ cd puppeteer-demo 復制代碼

初始化項目

$ npm init 復制代碼

安裝 Puppeteer。

由于 Puppeteer并不是穩(wěn)定的版本而且每天都在更新，所以如果你想要最新的功能可以直接通過 GitHub 的倉庫安裝。

$ npm i --save puppeteer 復制代碼

安裝時可能會出現(xiàn)以下報錯:

ERROR: Failed to download Chromium r588429! Set "PUPPETEER_SKIP_CHROMIUM_DOWNLOAD" env variable to skip download. 復制代碼

Chromium瀏覽器有58M左右，可能會出現(xiàn)安裝失敗的情況。

解決方法一：

vi .npmrctype puppeteer_download_host = https://npm.taobao.org/mirrorsyarn add puppeteer -D 復制代碼

代理puppeteer下載地址

解決方法二：官方建議設(shè)置環(huán)境變量 PUPPETEER_SKIP_CHROMIUM_DOWNLOAD 忽略瀏覽器的下載

env PUPPETEER_SKIP_CHROMIUM_DOWNLOAD=true npm i puppeteer -D 復制代碼

引申一下~

環(huán)境變量

Puppeteer 尋找某些環(huán)境變量來幫助其操作。 如果 puppeteer 在環(huán)境中沒有找到它們，這些變量的小寫變體將從 npm 配置 中使用。

• HTTP_PROXY, HTTPS_PROXY, NO_PROXY - 定義用于下載和運行 Chromium 的 HTTP 代理設(shè)置。
• PUPPETEER_SKIP_CHROMIUM_DOWNLOAD - 請勿在安裝步驟中下載綁定的 Chromium。 PUPPETEER_DOWNLOAD_HOST - 覆蓋用于下載 Chromium 的 URL 的主機部分。
• PUPPETEER_CHROMIUM_REVISION - 在安裝步驟中指定一個你喜歡 puppeteer 使用的特定版本的 Chromium。

引申結(jié)束~

忽略了Chromium瀏覽器下載后，我們成功下載好了puppeteer。然后去找puppeteer安裝包package.json中對應(yīng)的chrome版本。(puppeteer/package.json->puppeteer.chromium_revision，具體見lib/Downloader.js)

這里的依賴chromium版本是588429，

接著去官網(wǎng)手動下載Chromium文件，下載地址：npm.taobao.org/mirrors/chr… 解壓后放在本地

在項目中引入Chromium文件

一、直接放在puppeteer默認讀取目錄下

例如：node_modules\puppeteer.local-chromium\win64-526987(系統(tǒng)類型-版本號)\chrome-win32(下載的文件名)\

二、放在其他目錄

我將Chromium文件直接放在項目目錄puppeteer-demo下，運行時需要使用puppeteer.executablePath()設(shè)置路徑參數(shù)

const pathToExtension = require('path').join(__dirname, 'chrome-mac/Chromium.app/Contents/MacOS/Chromium');puppeteer.launch({executablePath: pathToExtension}); 復制代碼

---

puppeteer.executablePath()

returns: A path where Puppeteer expects to find bundled Chromium. Chromium might not exist there if the download was skipped with PUPPETEER_SKIP_CHROMIUM_DOWNLOAD.

---

運行Puppeteer

新建screenShot.js，引入puppeteer包然后配置Chromium啟動路徑。 調(diào)用puppeteer.launch方法啟動Chromium。

這里需要提醒注意申明的函數(shù)是一個async函數(shù)，使用了ES 2017 async/await特性。該函數(shù)是一個異步函數(shù)，會返回一個Promise。如果async最終順利返回值，Promise則可以順利reslove，得到結(jié)果；否則將會reject一個錯誤。

因為我們使用了async函數(shù)，我們使用await來暫停函數(shù)的執(zhí)行，直到Promise返回一個browser對象。

const puppeteer = require('puppeteer');(async () => {const pathToExtension = require('path').join(__dirname, 'chrome-mac/Chromium.app/Contents/MacOS/Chromium');const browser = await puppeteer.launch({headless: false,executablePath: pathToExtension});const page = await browser.newPage();await page.goto('https://www.baidu.com');await page.setViewport({width: 1000, height: 500});await page.screenshot({path: 'example.png'});await browser.close(); })(); 復制代碼

總結(jié)

以上是生活随笔為你收集整理的puppetter安装就踩坑-解决篇的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯，歡迎將生活随笔推薦給好友。