html - 检测页面上是否加载了图像

Question

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

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

Answer 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>

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

Answer 2

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

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

Answer 3

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

Answer 4

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

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

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

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

}

Answer 5

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

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

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

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