puppeteer可以當做一個UI測試的小工具，在Chrome中運行抓取網站內容，或是生成頁面的截圖及PDF，且對於SPA網頁可以抓取到pre-rendered content。
建議使用Node v7.6.0以上版本
安裝puppeteer時會自動幫你載好Chromium，在Windows環境可以直接開始使用
npm install puppeteer
index.js
const puppeteer = require('puppeteer')
const configMap = {
viewport: {
width:1920, //page width in pixels. required
height:1080,//page height in pixels. required
deviceScaleFactor: 1, // Specify device scale factor (can be thought of as dpr). Defaults to 1.
isMobile: false, // Whether the meta viewport tag is taken into account. Defaults to false.
hasTouch: false, // Specifies if viewport supports touch events. Defaults to false
isLandscape: false // Specifies if viewport is in landscape mode. Defaults to false.
}
};
(async () => {
const browser = await puppeteer.launch({args: ['--no-sandbox', '--disable-setuid-sandbox']});
const page = await browser.newPage()
await page.goto('https://lanlanlue.blogspot.com/')
await page.setViewport(configMap.viewport)
await page.screenshot({ path: 'example.png' })
await browser.close()
})();
viewport 可以設定所需截圖的size跟適用裝置
執行 node index.js 資料夾目錄底下就會多一個example.png的圖片檔 ↓長這樣
EC2
本機測試好後，接下來把東西丟到EC2跑看看，沒辦法正常運行。Linux環境就會比較麻煩一點，需要安裝其他東西 可以參考這篇
先檢查缺了哪些東西
進到puppeteer目錄底下
$ cd /node_modules/puppeteer/.local-chromium/linux-609904/chrome-linux/
注意，linux-609904會因為版本不同而有差異
在這目錄下執行
ldd chrome | grep not
會顯示很多 **** => not found 缺少的東西
先安裝以下
$ sudo yum install cups-libs dbus-glib libXrandr libXcursor libXinerama cairo cairo-gobject pango
再查看一次
ldd chrome | grep not
應該還是會有不少個缺少的
原作那篇指出因為Amazon Linux少一些gtk內建的東西，需要從別的地方借用
以下都裝一裝
# Install ATK from CentOS 7
$ sudo rpm -ivh --nodeps http://mirror.centos.org/centos/7/os/x86_64/Packages/atk-2.22.0-3.el7.x86_64.rpm
$ sudo rpm -ivh --nodeps http://mirror.centos.org/centos/7/os/x86_64/Packages/at-spi2-atk-2.22.0-2.el7.x86_64.rpm
$ sudo rpm -ivh --nodeps http://mirror.centos.org/centos/7/os/x86_64/Packages/at-spi2-core-2.22.0-1.el7.x86_64.rpm
# Install GTK from fedora 20
$ sudo rpm -ivh --nodeps http://dl.fedoraproject.org/pub/archive/fedora/linux/releases/20/Fedora/x86_64/os/Packages/g/GConf2-3.2.6-7.fc20.x86_64.rpm
$ sudo rpm -ivh --nodeps http://dl.fedoraproject.org/pub/archive/fedora/linux/releases/20/Fedora/x86_64/os/Packages/l/libXScrnSaver-1.2.2-6.fc20.x86_64.rpm
$ sudo rpm -ivh --nodeps http://dl.fedoraproject.org/pub/archive/fedora/linux/releases/20/Fedora/x86_64/os/Packages/l/libxkbcommon-0.3.1-1.fc20.x86_64.rpm
$ sudo rpm -ivh --nodeps http://dl.fedoraproject.org/pub/archive/fedora/linux/releases/20/Fedora/x86_64/os/Packages/l/libwayland-client-1.2.0-3.fc20.x86_64.rpm
$ sudo rpm -ivh --nodeps http://dl.fedoraproject.org/pub/archive/fedora/linux/releases/20/Fedora/x86_64/os/Packages/l/libwayland-cursor-1.2.0-3.fc20.x86_64.rpm
$ sudo rpm -ivh --nodeps http://dl.fedoraproject.org/pub/archive/fedora/linux/releases/20/Fedora/x86_64/os/Packages/g/gtk3-3.10.4-1.fc20.x86_64.rpm
# Install Gdk-Pixbuf from fedora 16
$ sudo rpm -ivh --nodeps http://dl.fedoraproject.org/pub/archive/fedora/linux/releases/16/Fedora/x86_64/os/Packages/gdk-pixbuf2-2.24.0-1.fc16.x86_64.rpm
我是還有缺少libasound.so2
就裝這個
yum install alsa-lib-devel
還是不行的話，找看看
yum provides */lbasound.so2
再不行就
yum install kernel-headers kernel-devel ffmpeg-devel
其餘有碰到的話可以Google丟一下關鍵字找看看其他人怎麼裝的
EC2運行抓到的圖片長這樣... 中文字會被吃掉應該是編碼還需要調整
