检测页面上是否加载了图像答案

【问题标题】：Detect if image is loaded on page检测页面上是否加载了图像
【发布时间】：2010-10-28 13:07:03
【问题描述】：

我的问题不是这样的：Browser-independent way to detect when image has been loaded

我的网站上有广告，每次展示我都会获得报酬，最近我发现每个广告获得的展示次数急剧下降，但我每月获得的平均点击次数有所增加。我是否可以检测图像是否已加载，或者是否已加载类似 404（常见于廉价广告拦截器）的内容？

【问题讨论】：

【解决方案1】：

你现在怎么数？从您的问题来看，我怀疑您正在解析服务器日志或图像是通过动态 url 提供的。如果是这种情况，那么丢弃可能是由客户端或代理缓存引起的。用户正在查看广告，但请求从未到达您的服务器。

显而易见的解决方案是禁用缓存，但这对您的访问者非常粗鲁。现在常用的方法是使用 1px GIF 作为信标来计算广告。 JS 也可以工作，但是当 JS 被禁用时你会丢失命中。

<div id="ad">
  <img src="/real.gif?ad_id=3435">
  <img src="/beacon.php?ad_id=3435&random=6354377">
</div>

顺便说一句：如果计数是由广告提供商完成的，那么他们总是有可能在撒谎。营销人员通常不是最诚实或最有原则的人。

【讨论】：

【解决方案2】：

通常广告拦截器不是“急剧下降”的原因...

您可以添加将“ping”您的广告图片服务器的 javascript，或者您可以检查要加载的图片...两者都非常容易实现，但如果失败，它将扰乱合法用户。例如，我讨厌页面在关闭时挂起，因为有人收集统计数据并在 onunload 事件中向服务器发送请求...

【讨论】：

【解决方案3】：

加载图像时，IE 上的图像标记中添加了一个“完整”属性。您还可以监听图像上的“加载”和“错误”事件。

【讨论】：

【解决方案4】：

一种方法是使用 Ajax 记录图像加载，使用图像的 onload 事件。如果您以相同方式记录页面加载，则可以将页面加载与成功加载图像的页面加载进行比较。

<img src="..." onload="logMe(this)" />

function logMe(img) {
   now = new Date()
   src = this.src

   ....your Ajax code that writes to the server log.

}

【讨论】：

【解决方案5】：

1.) 图像有一个 onload 事件...您可以看到它何时/是否被触发。

2.) 您可以使用 DOM/JS 来查看图像上的属性是否存在并符合您的预期。

3.) 请注意，如果图像没有唯一路径，或者提供缓存服务，浏览器将不会重新获取图像（因此重复访问不会重新加载图像）

郑重声明，如果您按/展示获得报酬，那您就很幸运了。大多数系统只关心命中。因此，如果加载了图像，则没有任何意义……但是如果用户单击它，则有补偿。

【讨论】：