批量截图任务
作为一个软件工程师,不只是做好自己的本职工作(ios),而是需要解决项目中的技术问题。这次就是解决自动截图的问题
早期公司的数据工程师利用 phantomjs 来截图,后期不断发现截图效率低,加之开发者团队不再维护,因此决定将截图这部分跟你剥离开来,以后方便开发维护。我就承担了这个工作
puppeteer
puppeteer is a node library which provides a high-level api to control chrome or chromium over the devtools protocol. puppeteer runs headless by default, but can be configured to run full (non-headless) chrome or chromium.
安装问题
一开始按照往常的套路(npm install --save puppeteer
) 好几次都卡住了,后期查找资料发现切换到国内的镜像就可以顺利下载
puppeteer_download_host=https://storage.googleapis.com.cnpmjs.org npm i --save puppeteer
puppeteer_download_host=https://storage.googleapis.com.cnpmjs.org npm i --save puppeteer
npm install
usage
const puppeteer = require('puppeteer'), fs = require('fs'), path = require('path'), request = require('request') function mkdirssync(dirname) { if (fs.existssync(dirname)) { return true } else { if (mkdirssync(path.dirname(dirname))) { fs.mkdirsync(dirname) return true } } } var snapshotfolerpath = path.join(__dirname, '../snspshot/') mkdirssync(snapshotfolerpath) function snapshot (taskinfo) { return new promise(function (resolve, reject) { (async function(){ // 启动chromium const browser = await puppeteer.launch({ignorehttpserrors: true, headless:true, args: ['--no-sandbox']}) // 打开新页面 const page = await browser.newpage() // 设置页面分辨率 await page.setviewport({width: 1920, height: 1080}) // 访问 await page.goto(taskinfo.websiteurl, {waituntil: 'domcontentloaded'}).catch(err => console.log(err)) await page.waitfor(1000) try { // 截图 await page.screenshot({path: snapshotfolerpath + taskinfo.imagename, fullpage:true}).catch(err => { console.log('截图失败: ' + err) }); await page.waitfor(6000) } catch (e) { console.log('failed ' + e) } finally { await browser.close() fs.stat(snapshotfolerpath + taskinfo.imagename, function(err,stats){ if (err) { reject('fail') } else { if (stats.isfile()) { resolve('success') } } }) } })() }) } module.exports = snapshot
如何安装 (linux 、unix 操作系统)
如果你有翻墙环境
如果你没有翻墙环境
流程说明
while 循环去调用接口去获取当前的截图任务
如果有截图任务那么就去截图
截图成功不管失败还是成功都去通知服务端。如果失败将当前任务告诉服务端,如果成功将当前任务信息和截图成功的绝对路径告诉服务端
一些说明
demo 中执行 npm start 真正执行的是 quickstart.js 中的代码。完整的“获取截图任务、截图、截图上传到oss、失败则将失败任务上传到服务”逻辑在 index.js 文件中
todolist
代码地址 ()
总结
以上就是这篇文章的全部内容了,希望本文的内容对大家的学习或者工作具有一定的参考学习价值,如果有疑问大家可以留言交流,谢谢大家对移动技术网的支持。
如对本文有疑问, 点击进行留言回复!!
MFC的静态库.lib、动态库.dll(包含引入库.lib)以及Unicode库示例
CTF 刷题记录(一) 白云新闻搜索(手动与自动化SQL注入)
javascript如何使用函数random来实现课堂随机点名方法详解
网友评论