官方文檔:Puppeteercss
今天大概介紹一下我項目用到的puppeteer操做:html
// 啓動瀏覽器 const browser = await puppeteer.launch({ executablePath: 'xxxx', // 這裏能夠替換Chromium or Chrome的可執行文件,代替安裝puppeteer附帶的chrome args: [ '--disabled-gpu', // 正常服務器連顯卡都沒有 '--no-sandbox', // 非沙箱模式 ] }) // 打開頁面 const page = await browser.newPage(); await page.goto('file://xxxx/index.html'); // 設置頁面viewport大小爲5頁A4的大小 const unitPX = 37.7813, pageSize = 5; await page.setViewport({ width: Math.ceil(unitPX * 21), height: Math.ceil(unitPX * 29.7 * pageSize) }) // 截圖,得到的res是pdf的二進制數據 // koa的話,這樣輸出: // ctx.set('Content-Disposition', 'attachment; filename="index.pdf"'); // ctx.body = res // preferCSSPageSize:true 按照css來渲染大小,不自動縮放 const res = await page.pdf({ preferCSSPageSize: true }); // 到瀏覽器的上下文去執行一些腳本,而且獲取最終返回的結果 const textList = page.evaluate(selector => { let domList = document.querySelectorAll(selector); return [...domList].map(txt => txt.innerText) }, '#wrapper .text')
上面的操做其實已經能夠完成至關一部分任務了!其餘api看官方文檔查詢chrome