why is this toDataURL line a security error?

问题:

If an image from another site, is loaded to a page, and then written to canvas as a partial ingredient in a composite, using:

context.drawImage(image, 0, 0, w, h);

it would seem anything insecure would already have occurred on the draw to the canvas. Why then would

window.location = canvas.toDataURL('image/png');

present an error message. SECURITY_ERR; DOM Exception 18. It doesn't seem any more insecure than the extra step of saving the external site image elsewhere first.

My question is not how to get around this, so much, or what the error means, but rather,

Why is this insecure? If the page is loaded by the server the action is surely expected by the author.

回答1:

As per the spec, information leakage can occur if scripts from one origin can access information (e.g. read pixels) from images on another origin. The worry is that a malicious app could deduce information that it otherwise wouldn't have access to by loading in an image from another domain/origin (easily done with images) and reading the pixel content. XHR has protections built in place to prevent XD leakage. Images do not.