帮别人做网站要投资吗,wordpress 4.5.1,做语音聊天网站要多少钱,营销策划策划公司前两篇文章《Node.js和Puppeteer进行Web抓取的简单使用》 和《Puppeteer结合Jest对网页进行测试》已经了解到Puppeteer大致可以做点什么事情#xff0c;之前提到过最终自动化需要一个数组配置。这篇文章将会简单是一个读取配置文件实现自动化的脚本。
脚本
就拿《Node.js和P…前两篇文章《Node.js和Puppeteer进行Web抓取的简单使用》 和《Puppeteer结合Jest对网页进行测试》已经了解到Puppeteer大致可以做点什么事情之前提到过最终自动化需要一个数组配置。这篇文章将会简单是一个读取配置文件实现自动化的脚本。
脚本
就拿《Node.js和Puppeteer进行Web抓取的简单使用》 代码举例
const puppeteer require(‘puppeteer’);
let scrape async () {
// 打开一个浏览器const browser await puppeteer.launch();// 新建一个页面const page await browser.newPage(); // 打开urlawait page.goto(‘https://www.johancruijffarena.nl/calendar.htm); // 针对某个元素 获取数据const result await page.evaluate(() {var data [];var tables document.querySelectorAll(‘table’);data tables.length; return data;}, ); // 关闭浏览器browser.close();return result
}
scrape().then((value) {console.log(value);
});这个就是日常mk代码逻辑如果要转换配置化那就先理清步骤然后对配置数据建模。
开始构建数据、纯函数
从代码看出来可以列出步骤如下 步骤1: 打开一个浏览器 步骤2: 新建一个页面 步骤3: 打开url 步骤4: 针对某个元素 获取数据 步骤5: 关闭浏览器 可以看出每个步骤都是一个操作类型这个时候数据里面可以定一个操作类型的keynodeType
{nodeType: any
}步骤1
因为一个流程只操作一个浏览器因此配置数据可以省略这个步骤当程序运行时默认执行这个步骤就好了同时帮步骤1操作提取一个函数(尽量保证是一个纯函数后续会有篇幅),
const getBrowser async () {const browser await puppeteer.launch();return browser
}步骤2和步骤3
步骤2和步骤3可以合并成一个步骤打开一个页面那必须得跳转url吧那么可得到一个配置数据
{nodeType: start,url: https://www.johancruijffarena.nl/calendar.htm
},创建一个只打开页面的纯函数
const runNodeStart async (arg) {const { browser, task } argconst { url } taskconst page await browser.newPage()await page.goto(url, {waitUntil: domcontentloaded,});return page
}步骤4
该操作也得定义nodeType告诉程序该做什么事情因为需要检索元素需要关键字可以设置selector为key
{nodeType: pick,selector: table
}函数
const getPick async (arg) {const { task } argconst { selector } taskconst result await page.evaluate(() {var data [];var tables document.querySelectorAll( selector );data tables.length; return data;}, ); return result
}步骤5:
同理可以得到一个配置数据
{nodeType: close,
},一个函数
const runClose async (arg) {const { browser, task, page } argawait browser.close();return false
}配置数据如下
const datas [
{. // 打开页面 nodeType: start,url: https://www.johancruijffarena.nl/calendar.htm
},
{ // 获取数据nodeType: pick,selector: table
},
{ // 关闭浏览器nodeType: close,
},
]MK代码实现
其实一看数据配置就是一个数组只要我们遍历这个数组就可以完成我们配置自动化的效果。for循环简单粗暴:
const main async () {
const browser await getBrowser()
const len datas.length
let page null
let pickData
for (let i 0; i len; i) {const { nodeType } datas[i]if (nodeType start) {const data await runNodeStart( { browser, task: datas[i]})page data.page} else if (nodeType pick) {pickData await getPick( { browser, task: datas[i], page} )} else if (nodeType close) {await runClose({browser})}
}
}
当然这块代码还是有很大的优化空间必须实现功能较全的自动化通过for、if、else if去实现代码不太优雅各位有啥想法不优雅的优化方式 相关源码