使用 Puppeteer 提高生产力

TL:DR：

Puppeteer是网络上最强大的网站自动化工具之一，可用于执行网站或浏览器内的各种自动化操作。今天，我不会直接给出一大段代码（除了截取页面屏幕截图之外，它几乎没有任何实际作用），而是会尝试讲解一些技巧，您可以在下一个项目或任何测试中使用它们。

👻 什么是木偶师：

Puppeteer 是一款浏览器自动化工具，它使用无头 Chromium 浏览器来自动化互联网上的活动。

Puppeteer 使用 Google 提供的高级 API 与无头 Chrome 浏览器进行交互。它提供了高度的灵活性和可扩展性，以便修改 Puppeteer 的默认行为。

🚀 启动它：

启动 Puppeteer 时，人们通常使用基本配置，但这里我将展示一些高级修改，以便以各种模式启动 Puppeteer。

这里我们使用三种主要选项

• 启动 Puppeteer 时，将 headless 标志设置为false，因为它会在屏幕上显示浏览器的活动。
• 第二个标志是 Linux 特有的。我在这里使用它，是因为如果我排除它，代码在 Ubuntu 20.04 上会出错。
• 这个选项非常实用，因为它会从浏览器窗口中移除“* Google chrome is control by the automated software*”标签。

然后我们所做的就是使用launch() 函数启动它，然后将页面重定向到谷歌。

🤖 以隐身模式启动 Puppeteer :-

在进行自动化操作时，总会遇到需要使用 Chrome 浏览器隐身模式的情况。如果某个网站阻止你访问有用的内容，比如他们在你的本地存储(localStorage)中存储了 cookie ，将你标记为机器人，导致你无法访问，那么隐身模式就非常有用。

那么解决方案就在这里。

启动时添加这两行代码，Puppeteer 就会自动以隐身模式打开。酷吧？8)

处理导航：

在将测试/自动化扩展到多个页面时，处理导航至关重要。如果导航处理不当，我们可能会遇到以下问题：

Failed to execute. Mostly because context destroyed due to navigation

为避免此类问题，请按如下方式处理导航

这是在谷歌上进行搜索的示例。在搜索框中输入搜索词（需要稍作延迟以避免被机器人检测到），然后按回车键。

之后，请等待导航完成且 DOM 内容完全加载后再继续。

此外，我们还可以使用两个约束条件来检查页面是否已完全加载。

• 'domcontentloaded'：DOM 加载完成后立即执行
• '加载'：等待所有内容（包括 JavaScript、CSS 文件和图像）加载完毕。

😎 与元素互动：

我们需要点击网页才能获取信息。我们都知道这一点，但Puppeteer却不知道。因此，强制它点击元素是我们必须掌握的关键功能之一。

😂 你会经常用到这个功能，因为它能让你平滑地滚动页面，直到找到要点击的元素。如果元素位于页面底部，它不会直接点击，而是会先滚动到目标位置，然后再点击。

使用 $$eval() 评估事物：

如果遇到不想直接操作 DOM 的情况，可以使用 `eval()` 函数来获取元素的值
，例如点击元素、获取文本内容等等，这非常有用。

使用 $$eval() 而不是原生 DOM API，例如

javascript document.getElementById("blah")

许多人更喜欢这种方式。因为如果我们使用 eval()，Puppeteer 会高效地搜索 DOM 并内部管理所有操作，但使用原生 API 会给 Puppteer 增加额外的负载。尽管这种方式更受欢迎。

🎯 最后想说：

Puppeteer 在自动化测试和其他方面都非常有用。但是，你必须注意漏洞检测。在本文中，我简要介绍了一些日常使用中比较重要的事项（占比不到 1%）。如果你想了解更多，请在评论区留言。我很乐意听听你的想法💜

🙏感谢阅读……