YAYA Share
article
Technology

Headless 架构完全指南：原理、优势及实践

11 min read
author
Jane Doe

浏览器 Headless 模式以及如何使用它绕过验证码

什么是浏览器 Headless 模式？

浏览器 Headless 模式是指在没有图形用户界面 (GUI) 的情况下运行浏览器。这意味着浏览器可以在后台运行，而无需显示任何可见的窗口或界面 1。 就像任何其他浏览器一样，Headless 浏览器也可以访问网页、与网页元素交互并执行 JavaScript 代码 2。 唯一的区别在于您无法在屏幕上看到任何内容，因为它没有图形界面 3。 程序在后台运行，模拟了机器人和爬虫程序查看互联网的方式 2。

Headless 模式的用途

Headless 浏览器主要用于以下场景 4：

  • 网页测试: 在现代 Web 应用程序中进行测试自动化，例如进行单元测试、集成测试和端到端测试。
  • 网页截图: 对网页进行截图，例如生成网页缩略图或捕捉网页特定状态的图像。
  • JavaScript 库测试: 运行 JavaScript 库的自动化测试，例如测试库的功能和性能。
  • 网页交互自动化: 自动执行网页交互操作，例如填写表单、提交数据和点击按钮。
  • 网页抓取: 从网站提取数据，例如收集产品信息、价格和评论。
  • 性能监控: 监控网站性能，例如测量页面加载时间和资源使用情况。

然而，Headless 浏览器测试也存在一些局限性 1。 例如，由于 Headless 浏览器不渲染网页的视觉内容，因此难以测试与用户界面相关的功能，例如布局、样式和交互效果。 此外，Headless 浏览器可能无法完全模拟真实用户的行为，例如鼠标移动和滚动，这可能会影响测试结果的准确性。

如何使用 Headless 模式？

大多数现代浏览器，例如 Chrome、Firefox 和 Edge，都支持 Headless 模式 5。 以 Chrome 为例，您可以通过命令行使用 —headless 标志启动 Chrome 的 Headless 模式 4 4：

Bash

chrome --headless --disable-gpu --remote-debugging-port=9222 https://www.example.com

这将启动一个 Headless Chrome 实例，并在端口 9222 上启用远程调试。您可以使用 Chrome DevTools 远程调试连接到 Headless 实例并进行检查 4。

除了 —headless 标志之外，Chrome Headless 模式还支持其他一些命令行标志 4：

  • —dump-dom: 打印指定页面的序列化 DOM。
  • —screenshot: 截取目标页面的屏幕截图并将其保存为当前工作目录中的 screenshot.png 文件。
  • —print-to-pdf: 将目标页面保存为当前工作目录中名为 output.pdf 的 PDF 文件。
  • —no-pdf-header-footer: 省略打印页眉（包含当前日期和时间）和页脚（包含 URL 和页码）。
  • —timeout: 定义最大等待时间（以毫秒为单位），即使页面仍在加载，也会在此时间后通过其他标志捕获页面的内容。
  • —virtual-time-budget: 充当任何时间相关代码（例如 setTimeout/setInterval）的“快进”。
  • —allow-chrome-scheme-url: 访问 chrome:// URL 所需的标志。

您还可以使用 Puppeteer 等工具以编程方式控制 Headless 浏览器 5。 Puppeteer 是一个 Node 库，它提供了一个高级 API 来控制 Headless Chrome 或 Chromium 4。

如何使用 Headless 模式绕过验证码？

虽然 Headless 浏览器本身不能绕过验证码，但它们可以与其他工具和技术结合使用来实现此目的。 验证码系统旨在通过识别区分机器人和人类的行为模式来阻止自动化程序 6。

使用验证码解决服务

一种常见的方法是使用第三方验证码解决服务，例如 2Captcha 7。 这些服务使用人工或机器学习算法来解决验证码，并将结果返回给您的脚本。

以下是如何使用 Puppeteer 和 2Captcha 绕过验证码的基本步骤 7 7：

  1. 使用 Puppeteer 启动一个 Headless 浏览器实例。
  2. 导航到包含验证码的页面。
  3. 使用 Puppeteer 的 page.evaluate() 方法将验证码数据提交到 2Captcha。
  4. 从 2Captcha 获取验证码解决方案。
  5. 使用 page.evaluate() 将验证码解决方案填入网页表单中相应的字段，例如，将其输入到 ID 为 “g-recaptcha-response” 的隐藏文本字段中 7。
  6. 提交表单。

// add linkCard duckgogo

代码示例 (使用 Puppeteer 和 2Captcha):

JavaScript

const puppeteer = require('puppeteer');
const request = require('request-promise-native'); // 用于发送 HTTP 请求

// 2Captcha API 密钥
const apiKey = 'YOUR_2CAPTCHA_API_KEY';

(async () => {
const browser = await puppeteer.launch({ headless: true });
const page = await browser.newPage();
await page.goto('https://www.example.com'); // 替换为目标网页

// 获取 reCAPTCHA 的 sitekey
const sitekey = await page.evaluate(() => {
return document.querySelector('[data-sitekey]').getAttribute('data-sitekey');
});

// 将 reCAPTCHA 数据提交到 2Captcha
const captchaSolution = await solveCaptcha(sitekey, page.url());

// 将 2Captcha 的解决方案填入 reCAPTCHA 响应字段
await page.evaluate(`document.getElementById('g-recaptcha-response').innerHTML='${captchaSolution}';`);

// 提交表单
await page.click('button[type="submit"]');

// ... 处理结果 ...

await browser.close();
})();

// 使用 2Captcha API 解决 reCAPTCHA
async function solveCaptcha(sitekey, pageurl) {
const formData = {
method: 'userrecaptcha',
key: apiKey,
googlekey: sitekey,
pageurl: pageurl,
json: 1
};

// 发送请求到 2Captcha API
const response = await request.post('http://2captcha.com/in.php', { form: formData });
const requestId = JSON.parse(response).request;

// 轮询 2Captcha API 获取结果
let captchaSolution = null;
while (!captchaSolution) {
await new Promise(resolve => setTimeout(resolve, 5000)); // 等待 5 秒
const resultResponse = await request.get(`http://2captcha.com/res.php?key=${apiKey}&action=get&id=${requestId}&json=1`);
const result = JSON.parse(resultResponse);
if (result.status === 1) {
captchaSolution = result.request;
}
}

return captchaSolution;
}

其他绕过验证码的方法

除了使用验证码解决服务之外，还有一些其他的方法可以尝试绕过验证码：

  • 使用代理: 使用代理服务器可以隐藏您的真实 IP 地址，使网站更难检测到您是机器人 7。
  • 模拟人类行为: 使用 Puppeteer 等工具可以模拟人类行为，例如鼠标移动、点击和页面滚动，使您的脚本看起来更像真人用户 6。 通过注入随机性和类似人类的行为，您可以使验证码系统更难区分您的脚本和真人用户 6。
  • 使用隐身模式: 启用隐身模式可以防止浏览器存储 cookies 和其他跟踪信息，使网站更难识别您的身份 8。

总结

浏览器 Headless 模式是一种强大的工具，可用于各种自动化任务，包括绕过验证码。 它允许您在没有图形用户界面的情况下运行浏览器，从而实现高效的网页测试、数据抓取和自动化操作。

然而，在使用 Headless 模式绕过验证码时，务必了解其伦理和法律风险。 验证码的目的是保护网站免受机器人滥用，绕过验证码可能会违反网站的服务条款或相关法律法规。 此外，网站也在不断改进其反机器人技术，因此绕过验证码的方法可能并不总是有效。

在使用 Headless 模式和任何验证码绕过技术时，请务必遵守道德准则和法律法规，并确保您的行为不会对网站或其他用户造成负面影响。

引用文章

1. What Is a Headless Browser and Where Is It Used? - Oxylabs, accessed January 1, 2025, https://oxylabs.io/blog/what-is-headless-browser
2. What Is a Headless Browser And What Are They Used For? | Nimble Data - Nimbleway, accessed January 1, 2025, https://www.nimbleway.com/blog/what-is-a-headless-browser
3. What is Headless Browser and Headless Browser Testing?, accessed January 1, 2025, https://www.browserstack.com/guide/what-is-headless-browser-testing
4. Chrome Headless mode | Chromium | Chrome for Developers, accessed January 1, 2025, https://developer.chrome.com/docs/chromium/headless
5. developer.chrome.com, accessed January 1, 2025, https://developer.chrome.com/docs/chromium/headless#:~:text=With%20Chrome%20Headless%20mode%2C%20you,projects%20like%20Puppeteer%20or%20ChromeDriver.
6. How to bypass CAPTCHA while web scraping (3 methods) - SOAX, accessed January 1, 2025, https://soax.com/blog/bypass-captcha
7. Bypassing CAPTCHAs with Headless Chrome | by Jarrod Overson - Medium, accessed January 1, 2025, https://jsoverson.medium.com/bypassing-captchas-with-headless-chrome-93f294518337
8. Bypassing CAPTCHAs with Headless Chrome using puppeteer - Stack Overflow, accessed January 1, 2025, https://stackoverflow.com/questions/55678095/bypassing-captchas-with-headless-chrome-using-puppeteer