在图像中嵌入分析代码以在显示图像时触发

Posted 2023-02-19

【中文标题】在图像中嵌入分析代码以在显示图像时触发

【英文标题】：Embed analytics code within image to be triggered when image is displayed

【发布时间】：2015-08-18 12:01:42

【问题描述】：

是否可以在图像中打包分析代码并在图像加载到网页时触发该代码？

图像将通过文件上传表单字段插入到页面中，例如，如果我要在这个问题中添加图像，而我无法直接访问将 html 或 JS 添加到页面。

目标是跟踪我无法访问任何代码的页面上的页面浏览量，只有上传图片的能力。

几乎有点像“特洛伊木马”方法，但没有任何恶意。

【问题讨论】：

参考File Uploader Vulnerabilities和Exploit Delivery via Steganography and Polyglots和javascript-Pics polyglots

我可能是错的，但我非常怀疑这是可能的。该方法需要将代码（无论意图是什么）注入到其他人的代码中，以根据加载事件执行。这正是为什么有跟踪像素通过附加参数的图像执行此类工作的原因，但由于您无法控制渲染图像或其 URL，因此它将无法工作。即使您能够附加图像 url 来发布参数，它也与在页面上执行 JS 代码不同。非常有限。

每一个在Linkedin上查看个人资料图片的跟踪者都可能被抓到。

【参考方案1】：

跟踪像素需要特定的结构和特定的服务器。

所以我无法想象特洛伊木马之类的东西，但您可以将图像加载作为一个事件进行跟踪。

试试这样的：

单一用途客户端

<img src=""  id="fblogo"/>

<script type="text/javascript">
    window.onload = function () 
        var logo = document.getElementById('fblogo');
        logo.onload = function () 
            ga('send', 'event', 'FB', 'Loaded');      
        ; 
        logo.src = 'https://facebook.com/fb/logo.png';
    ;
</script>

测量协议方式-服务器端

https://www.google-analytics.com/collect

?v=1                                    // Protokol version
&tid=UA-XXXX-Y                          // Property ID
&cid=55568765456                        // Client ID stored in database or random number 

&dh=forum.eu                            // referrer
&dp=image78974.png                      // filename

&t=event                                // send instruction

&ni=1                                   // non inteaction flag
&ec=Image                               // Event Category
&ea=Load                                // Event Action
&el=image78974.png                      // Event Label

【讨论】：

嗯不是我需要的。我希望将它附加到真实图像上，因此当我将它们嵌入论坛时，其他用户查看该图像时，他们也会从谷歌或 Facebook 获得一个跟踪 cookie，用于再营销。

那么当需要图像时，您必须在服务器端使用测量协议。每个包含的图像都应该由 php 或其他任何东西进行预处理，并且在返回图像数据之前，发送带有分析数据的 cURL。