0

如果可能的话，如何通过 XPCOM 获取网页上的所有图像？

图像可以在 HTML 中指定为某个 CSS 属性中的背景 url，在 img 标记内，或以 Web 开发人员可能包含的任何形式。

我尝试研究 imgIContainer、imgIDecodeObserver 和许多其他接口。尽管我们可以通过一种方式向 Mozilla 提供图像 URI，以便它加载图像、解码并返回 imgIContainer。但是我无论如何都找不到获取当前网页中的所有图像。

这必须在 Java 或 Javascript 中完成。

有什么建议么？

@Wladimir - 感谢您的帮助。

我想要所有图像，包括 CSS 结构（背景图像）。所以现在我正在监听来自 nsIWebProgressListener 的事件。


    onStateChange: function(webProgress, request, stateFlags, status) {
        if ((~stateFlags & (nsIWebProgressListener.STATE_IS_REQUEST | nsIWebProgressListener.STATE_STOP)) == 0) {
            var imgReq = request.QueryInterface(CI.imgIRequest);
            if (imgReq)
                var img = imgReq.image;
        }
    }

问题是request.QueryInterface(CI.imgIRequest)所有非图像请求都会引发异常。尽管可以通过将代码放在 try-catch 块中来忽略这些异常，但我更喜欢干净利落地做事。

是否有任何条件可以检查以了解请求是否为图像？

4

1 回答 1

0

您可以查看现有代码。页面信息对话框有一个媒体选项卡，可以成功显示页面上的大多数图像。重要的功能是grabAll()inpageInfo.js，它为每个元素调用（通过TreeWalker）。正如你所看到的，没有通用的方法来获取图像，这个函数而是window.getComputedStyle()用来提取这个元素的一堆 CSS 属性的值：background-image, border-image, list-style-image, cursor。它还将查找<img>, <svg:image>, <link>(favicon), <input>, <button>,<object>和<embed>标签。然而，它并不能识别所有内容，例如这些 CSS 结构将不会被识别：

.foo:before
{
  content: url(image.png);
}
.foo:hover
{
  background-image: url(image.png);
}

尽管如此，这可能是您所能得到的——除非您想查看网页加载时发出的请求。

编辑：如果您在执行请求时查看请求（通过网络进度侦听器），您可以执行以下操作：

if (request instanceof CI.imgIRequest)
  var img = request.URI.spec;

请注意，这request.image对您没有多大帮助，几乎所有方法imgIContainer都只能从本机代码访问。

于 2012-05-09T19:39:35.200 回答