假如现在你有这样的需求
每天在不同的网站爬取数据保存文档
每天本地指定文件夹的文件上传到网站
每天观察B站指定up主们对其标题识别进行点赞鼓励社区或点差净化网络
根据网页内容生成指定内容——可操作性很大哦
工欲善其事必先利其器
download:Automa - An extension for browser automation - Automa
learn:Getting started | Automa Docs
marketplace:Automa Marketplace - Automa
实现的方案有很多,关键是哪个用着舒服,这很重要
天下苦秦久矣
第一种 油猴脚本
遥想公瑾当年,小乔初嫁了,雄姿英发
优点:历史悠久,脚本库历史累计很多
缺点:开发页面丑
第二种 自行开发chrome拓展
草耕火种从零开始,告辞
优点:拓展的爸爸
缺点:学习成本高,需要选型进行热更新配置 综述 | Chrome 扩展开发文档 (gitbooks.io)
第三种 selenium.js驱动浏览器模拟操作
优点:社区活跃,接口能力丰富
缺点:基于脚本的开发,日常使用需要代码运行环境,分享体验受限
const {Builder} = require('selenium-webdriver');
require("chromedriver");
(async function helloSelenium() {
let driver = await new Builder
().forBrowser('chrome').build();
await driver.get('https://selenium.dev');
await driver.quit();
})();
第四种 新晋宠儿 Automa浏览器插件
优点:操作简单,开发体验好,分享体验佳
缺点:工作流市场尚未有很多现成的脚本
界面现代化
工作节点逻辑复用
实战例子
yapi想必很多人都知道是个接口维护的网站,但是当个typescript搬运工着实没有意思 所有的重复操作都是没有意义的,接下来就以接口生成的例子释放劳动力吧
export interface ListInfoParams {
brandId:integer
longitude:string
latitude:string
promotionPlatform:integer
guiderId:string
current:string
pageSize:string
storeName:string
}
export interface ListInfoResult {
storeId:number
storeName:string
latitude:number
longitude:number
}
export const listInfo = (data: ListInfoParams): ApiResponse<ListData<ListInfoResult>> =>
httpCatch.post('/store/user/relation/query/list/info',data)
运行后剪贴板里就是这些内容细心的朋友可能已经发现了promotionPlatform的类型错了,证明不是我手输的,此诚为抛砖引玉,后续在使用的过程中还会加入枚举类型的识别和生成及更多可能性 工作流已经在应用市场,当前的社区参差不齐,分享是为了你们写工作流给我用嘿嘿,我躺的更平点,嘿嘿
常用功能
日志管理
运行失败的点点滴滴
Debug模式
记录当前节点的上下文变量
主机分享
可以远程让你的测试小伙伴实时体验你的开发版本
上限很高的模块
直接用react在页面里加个子应用,自带样式隔离
执行工作流可以定制脚本执行前置的数据准备
结语
经过大量实践,这个浏览器插件真的戳中我的心窝窝,但凡有有关浏览器的操作我相信它都能胜任,甚至拖动验证码都可以暴力破解(因为大部分的空缺位置是在一个范围内,而且失败不发接口进行限制)通过滑动指定像素刷新再滑动指定像素的无脑方案。用github登录还可以把脚本存在云端,登录可同步下载,绝绝子。