除了在本地 iframe 中加载数据之外，还有其他实现可视化网络抓取工具的方法吗？

Question

我看了Portia 的视频，我在思考如何实现这样的工具。基本上，有一个 Web 应用程序，您可以在其中输入一个 URL，它会加载（就像您将它加载到一个独立的浏览器选项卡中一样），然后您将能够单击页面中的元素，并直观地选择要提取的数据。

我目前的一个想法是这样的：

1. 使用无头浏览器检索网站内容
2. 在 web 应用中有一个路由，可以为抓取的内容提供服务
3. 在数据选择页面的 iframe 中嵌入路由，以绕过同源策略
4. 集成一些 JavaScript 元素检查器库，以便能够直观地标记要被抓取的元素
5. 生成一组选择器
6. 使用选择器提取数据

我很感兴趣是否有/有什么其他方法来处理这个问题，特别是第 1 到 3 部分。

Answer 1

考虑到您要抓取的对象可能不处于活动状态（例如，它们不响应点击或按键）。

即使他们这样做，他们也可能不会处理元键，例如 Ctrl 或 Shift。

所以你可以做的就是像代理一样构建你的系统，重写内部 URL（无论如何你都需要这样做），除了你还需要注入 Javascript 代码来响应，比如说，点击。

那么您将不需要 IFRAME，只需导航到 www.your-scraper.com，在表单中请求 www.site-to-scrape.com，分配一个随机的 dab3b19f 并重定向到 dab3b19f.your-scraper.com - 并会看到 @987654327 的版本@ 所有（文本？）对象对 Ctrl-Click 做出反应的地方。

然后用户应该能够正常在站点中移动，除了持有例如点击时的 Ctrl 键不会将点击传递给被点击的对象，而是传递给一个处理程序，该处理程序可以识别事件目标并计算其 CSS 路径，然后在按需附加到 DOM 的固定 DIV 中弹出一个抓取菜单，并且关闭时删除。

这意味着您需要检测并劫持网站可能正在加载的几个可能的 Javascript 库。如果事情继续下去，可能你还需要去除一些反抓取代码（例如，网站可能会检查 DOM 完整性或尝试将处理程序重写为默认状态）。

同时，您还可以拦截并记录正常点击，以便能够在一定程度上进行复制（这取决于网站的动态程度，以及您如何与您的无头浏览器交互）。这将允许您自动重新导航站点、更改页面等，以访问各种对象。然后，您会得到一系列选择器和导航提示，可用于从导航页面中提取数据：

start
click        #menu ul[2] li[1] span
click        .right.sidebar[1] ul[1] li[5] input[type="checkbox"]
click        .right.sidebar[1] ul[1] li[5] button
scrape(TICK) #prices div div[2] div div span p
scrape(PRIC) #prices div div[2] div div span div span[2] p

然后可以修改抓取脚本以添加循环。不过，这会在以后发生。

您最终也会得到与Selenium 不太相似的东西。事实上你可能要考虑turning Selenium to your purpose的可能性。

Answer 2

这可能不是问题的完整答案，而是分享我的经验。

在我参与的一个项目中，我们有一个 Chrome 浏览器扩展，它允许在页面上直观地定位/选择元素，给它们“名称”并保存（我们称之为该过程“注释”），这导致在数据库中创建一条记录，其中包含目标站点 URL、字段名称和生成的 CSS 选择器或 XPath 表达式。

扩展基于selectorgadget library。

据我记得，生成的定位器要么是绝对的（从非常 html 或 body 根开始），要么只能使用元素或父元素之一的 id 属性 - 类似于“复制 XPath”和“复制 CSS 路径”工具可在 FireBug 中使用。

然后，我们有一个非常广泛的Scrapy 蜘蛛，它使用数据库中准备好的注释来抓取任何网站。好吧，那太好了，太容易成为现实了。当然，我们必须添加自定义代码来处理重动态网页、机器人检测、脆弱性和不同的网站特定逻辑。

_{（会进一步改进答案）。}