在onload JS DOM注入后抓取页面

Question

我正在构建一个从页面获取主图像（当前基于Content-Length ）的刮板。 它遍历所有<img>元素并发出HEAD请求。 但是某些页面，尤其是 移动设备，在页面加载后插入图片。 关于如何解决这个问题的任何想法？

我正在使用node.js

Answer 1

我不确定它是否可以解决您的问题，但是您可以考虑使用jsdom ，因为它可以获取和执行页面中的脚本，并在服务器端提供DOM。 就像是：

var request = require('request'),
    jsdom = require('jsdom').jsdom;

request(url, function(err, response, body) {
  if(err) return console.error(err);

  var doc = jsdom(body, null, {
    FetchExternalResources: ['script', 'img']
  });
  var window = doc.createWindow();

  var images = doc.getElementsByTagName('img');
});

Answer 2

使用PhantomJS 。 它“是带有JavaScript API的无头WebKit”。 将其视为可以通过JavaScript API控制的整个浏览器。 由于它是浏览器，它将完全执行页面，然后可以对其进行抓取。

它有点类似于 Node.js，但实际上是一个完整的浏览器，您的脚本可以完全访问您将其下拉的页面的DOM。 因此，通过使用jQuery之类的方法访问DOM而不是仅访问原始HTML来智能地“擦除”页面要容易得多 。

这是有关DOM操作的示例