从页面（Omniture 像素）获取呈现的 JavaScript？答案

【问题标题】：Fetching rendered JavaScript from a page (Omniture pixel)?从页面（Omniture 像素）获取呈现的 JavaScript？
【发布时间】：2010-12-09 12:01:08
【问题描述】：

我有一些代码（顺便说一下，它用于 Omniture SiteCatalyst），它根据我在页面源代码中设置的一些 JavaScript 对象变量呈现 1x1 像素。 JavaScript 最终会根据脚本代码创建一个 img，但 img src 并未硬编码到 HTML 中。给定页面的 URL，我如何弄清楚 img src 是什么？如果我只是抓取页面，我将获得预渲染的 JavaScript。

编辑

例如，假设我有 StackOverflow.html 的代码：

<html>
<script type="text/javascript">
a = 2
document.write(a)
</script>
</html>

我如何获取 StackOverflow.html 并以某种方式获取值“2”而不是我的所有脚本代码？

谢谢！

【问题讨论】：

仅供参考您的问题对我来说似乎有点含糊。如果您通过澄清和 cmets 回答现有答案，或者如果可能，编辑您的问题以提供更具体的示例，这将有所帮助。除非有人碰巧熟悉 SiteCatalyst，否则我们都会在黑暗中拍摄。
谢谢布赖恩。我要编辑它。
我编辑了它。介意看看吗？
我自己添加了一个答案。 mkoryak 的回答似乎也很合理，除非我们都误解了这个问题。
你需要这个只是为了测试吗？我的意思是你对半自动解决方案还满意吗？

标签： javascript testing tracking pixel

【解决方案1】：

编辑：

回答您重述的问题：

在我看来，您的问题是弄清楚页面在 JS 运行后会是什么样子。

没有简单的方法可以为您提供 100% 准确的结果，因为您需要实际运行 javascript 并查看结果，当您不在浏览器中时，这真的很不容易。

现在您有多种选择。你没有提到你使用什么工具来抓取页面，我假设你使用的是定制的刮板。如果您想继续使用刮刀，您可以：

考虑使用 rhino 来评估 JS。我不确定这会给你带来什么，你可以研究一下。
如果 document.write 是您关心的唯一调用，您可以解析出它使用的变量，然后尝试评估它们的值。这需要编写解析器，可能很困难。
您能做的最好的事情是使用诸如碲或硒之类的功能测试工具。这将使您可以访问 JS 已经运行的页面，您可以使用我的原始答案来获取您需要的值。

【讨论】：

这根本不能回答我的问题。
当你最初问你的问题时，你是模糊的，因此你得到了这个答案。无需对一个糟糕的问题投反对票：P
+1 mkoryak 的回答对于这样一个模糊的问题是有效的。 @Zachary：你读过 mkoryak 的编辑答案吗，它有帮助吗？您是否尝试在服务器端解析 JavaScript？
P.S.抱歉 mkoryak，我不小心删除了我的投票，在编辑问题之前我无法再次投票。

【解决方案2】：

我认为最好的方法是使用 Selenium，然后在页面中注入一些 javascript 来挖掘 DOM，或者在适当的情况下从全局窗口中检索值。

【讨论】：

【解决方案3】：

我会在 firebug 上使用 Net 面板并按图像请求进行过滤。你会看到它在创建的那一刻就消失了。此外，如果您提出分析请求，请尝试安装 Omnibug firebug 插件来跟踪和分解请求。

【讨论】：

【解决方案4】：

如果您在脚本在客户端（即在浏览器中）运行后尝试获取 a 的值，您应该能够以正常方式检索它。

进行以下设置：

index.html

此文件是您的网页。它包含一些内容、插入图像的跟踪脚本和您自己的脚本。

<!doctype html>
<html>
<head><title>My Page</title></head>
<body>
  <p>My Content<p>
  <!-- Start tracking code -->
  <script src="tracking.js"></script>
  <!-- End tracking code -->
  <script src="mycode.js"></script>
</body>
</html>

tracking.js

这是跟踪代码，大概是跟踪公司提供的。

var id = '1234foobar';
var visitorUserAgent = encodeURIComponent(navigator.userAgent);
document.write(
  '<img src="http://tracking.com/1x1.gif?id='
  + id + '&ua=' + visitorUserAgent + '" />'
);

mycode.js

如果您知道跟踪代码创建了哪些变量（如果有），您应该能够检索变量本身或至少检索跟踪代码创建的img 标记的src 属性。

var imgs = document.getElementsByTagName('img');
alert([id, visitorUserAgent, imgs[imgs.length - 1].src].join('\n'));

【讨论】：