在Ubuntu上使用 puppeteer 网页截图
一、安装:依赖包 + 字体
apt install nodejs npm gconf-service libasound2 libatk1.0-0 libatk-bridge2.0-0 libc6 libcairo2 libcups2 libdbus-1-3 libexpat1 libfontconfig1 libgcc1 libgconf-2-4 libgdk-pixbuf2.0-0 libglib2.0-0 libgtk-3-0 libnspr4 libpango-1.0-0 libpangocairo-1.0-0 libstdc++6 libx11-6 libx11-xcb1 libxcb1 libxcomposite1 libxcursor1 libxdamage1 libxext6 libxfixes3 libxi6 libxrandr2 libxrender1 libxss1 libxtst6 ca-certificates fonts-liberation libappindicator1 libnss3 lsb-release xdg-utils wget language-pack-zh-hant language-pack-zh-hans fonts-droid-fallback ttf-wqy-zenhei ttf-wqy-microhei fonts-arphic-ukai fonts-arphic-uming xfonts-wqy libjpeg-dev libpng-dev libtiff-dev libgif-dev libwebp-dev devscripts -y
如需单独安装字体(上面已包含本行内容):
apt install language-pack-zh-hant language-pack-zh-hans fonts-droid-fallback ttf-wqy-zenhei ttf-wqy-microhei fonts-arphic-ukai fonts-arphic-uming xfonts-wqy -y
更多字体安装请参考:
http://www.crazyken.cn/blog/post/426.html
http://www.crazyken.cn/blog/post/427.html
二、安装:puppeteer ( 会自动下载同步安装 chromium )
npm i puppeteer
由于部分地区网络原因,不能下载同步安装 chromium
npm i --save puppeteer --ignore-scripts npm config set unsafe-perm true npm config set puppeteer_download_host=https://npm.taobao.org/mirrors npm i puppeteer
单独安装chromium浏览器(已在上述命令中自动安装)
apt install chromium-browser -y
新建截图功能文件 index.js
const argv = process.argv //格式化为完整网址 var reg = /^([hH][tT]{2}[pP]:\/\/|[hH][tT]{2}[pP][sS]:\/\/)/; if (!reg.test(argv[2])) { argv[2] = 'http://' + argv[2]; } const puppeteer = require('puppeteer'); (async () => { const browser = await puppeteer.launch({ headless: true, //executablePath: "/chrome-mac/Chromium.app/Contents/MacOS/Chromium",//如果是手动安装,需要指定浏览器位置 //timeout: 30000, //设置超时时间 30 秒 ignoreHTTPSErrors: true, //如果是访问https页面 此属性会忽略https错误 devtools: false, // 打开开发者工具, 当此值为true时, headless总为false args: [ '--no-sandbox', '–-disable-setuid-sandbox', '--disable-gpu', '--disable-dev-shm-usage', '--no-first-run', '--no-zygote', '--single-process', //'--proxy-server=socks5://127.0.0.1:1080', //设置代理访问 ] }); const page = await browser.newPage(); await page.setUserAgent('Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/76.0.3809.132 Safari/537.36') await page.setViewport({ width: 1280, height: 800, deviceScaleFactor: 1, }); await page.setExtraHTTPHeaders({ 'Accept-Language': 'zh-CN,zh;q=0.9', 'Referer': argv[3], }); await page.goto(argv[2]); //, {waitUntil: 'domcontentloaded'} 在DOMContentLoaded事件触发时就返回结果,无需等到Load事件 await page.screenshot({ path: argv[3], type: 'png', // quality: 100, 只对jpg有效 // fullPage: true, // 指定区域截图,clip和fullPage两者只能设置一个 clip: { x: 0, y: 0, width: 1280, height: 791 } }); await page.close(); await browser.close(); })();
开始截图:
node index.js url filename.png