SECURITY_ERR: DOM Exception 18 on using getImageData in a Chrome Extension

Question

I\'m writing my first Chrome extension. I\'m trying to use jQuery and the jQuery Image Desaturate plugin to desaturate an image on a page on http://www.flickr.com.

I

Answer 1

Yep, this is a security limitation. As it says in the specs:

Whenever the toDataURL() method of a canvas element whose origin-clean flag is set to false is called, the method must raise a SECURITY_ERR exception.

Whenever the getImageData() method of the 2D context of a canvas element whose origin-clean flag is set to false is called with otherwise correct arguments, the method must raise a SECURITY_ERR exception.

Whenever the measureText() method of the 2D context of a canvas element ends up using a font that has an origin that is not the same as that of the Document object that owns the canvas element, the method must raise a SECURITY_ERR exception.

When I was working on a similar extension what I did was I passed an image url from a content script to a background page and did all canvas manipulations there, then converted canvas to data url and send it back to a content script:

//background.html:
function adjustImage(src, tab) {
    var img = new Image();
    img.onload = function() {
            var canvas = Pixastic.process(img);
            
            chrome.tabs.sendRequest(tab.id, {cmd: "replace", data: canvas.toDataURL()});
    };
    img.src = src;
}

Answer 2

So I too was working on an extension where I wanted to use image data from cross-domain acquired images and I found that IT IS POSSIBLE! (without any funky background page message passing)

@Serg, As it turns out, in web pages you can't do cross-domain stuff, however, after some further digging however, I found that in chrome extensions, you can!

The jist of it is, all you have to do is request permissions for Cross-Origin XMLHttpRequests in your manifest.

{
  "name": "My extension",
  ...
  "permissions": [
    "http://www.google.com/"
  ],
  ...
}

For more info (especially about how to remain secure) read this.