puppeteer 常用连接配置

一般本地开发时直接用 puppeteer 自带下载的浏览器,此时使用  puppeteer.launch() 开启浏览器,配置参数通过 args 传递: puppeteer.launch({ headless: false, // 取消无头 defaultViewport: { width: 1440, height: 780 },// 默认视口大小 args: [ `--disable-notifications=true`, // 关闭浏览器通知提示 `--blink-settings=imagesEnabled=false`, // 禁止加载图片 `--user-agent=${account.userAgent}`, // UA `--proxy-server=${proxy}`, // 代理 "--window-position=1921,0", // 打开的窗口位…

fabricjs + react 案例

一、案例 和 react 结合的使用案例:https://github.com/saninmersion/react-context-fabricjs 二、常见功能用法 以下代码都将采用 useContext 管理 canvas 调整 canvas 画板背景颜色 export const Menu: FC = () => { const { canvas } = useContext(FabricContext); const handelSetBackgroundColor = useCallback( (color: string) => { if (canvas) { canvas.backgroundColor = color; canvas.renderAll(); } }, [canvas] ); return }…

Puppeteer + opencv.js 自动化脚本实践经验总结(part 2)

阅读 part 1 在本节中将介绍之前提出的关于 opencv.js 的问题: * 如何将 opencv 引入到 node 项目。 * 如何识别页面元素。 * 如何获取目标元素的坐标。 * 如何提高识别准确率。 * 选用那种识别算法。 💡这里是示例代码:github 如何将 opencv 引入到 node 项目 您可以查阅官网教程:Using OpenCV.js、Using OpenCV.js In Node.js,这里我将做出我的复述。 您需要获取 opencv.js 源文件, opencv.js 您可以从 https://docs.opencv.org/{VERSION_NUMBER}/opencv.js 的在线文档下载预构建脚本(…

Puppeteer + opencv.js 自动化脚本实践经验总结(part 1)

使用 puppeteer 遇到的问题 浏览器会弹出"是否允许通知"的弹出框,这将阻断我的页面操作。 如何调节浏览器窗口大小。 如何调节页面视口大小。 本地调试时,开启的浏览器窗口遮住了我的代码编辑器。 设置 UA。 如何禁止图片加载,节省流量和带宽开销。 查找元素。 元素滚动到视口内。 点击元素。 元素截图。 如何防止键盘输入内容时触发了快捷键。 如何判定我的脚本执行成功了。我的脚本是否准确完成了点击某个按钮,是否准确的提交了某条评论,是否真的删除了一条内容? 网站给页面元素做了复杂的变种,让我无法使用 css 选择器定位元素。…

shell cp 复制时限制文件个数

场景介绍 我的 web 自动化脚本截取了大量页面图片并将它们存储到了阿里 oss,这是它们部分文件的目录结构: ➜ target_post_sponsored tree . ├── 100110425921069 │   ├── 20220524_000930-100000872442821-100110425921069-undefined.jpeg │   ├── 20220524_000930-100000872442821-100110425921069-undefined.txt │   ├── 20220524_002915-100038712511871-100110425921069-undefined.jpeg │   ├── 20220524_002915-100038712511871-100110425921069-undefined.txt │   ├── 20220524_004010-100025417368265-100110425921069-undefined.jpeg │   ├── 20220524_004010-10002541736826…