Edit Question - KnowledgeHub

Title Body

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'm loading my script (and jQuery and the plugin) programatically in my background.html: // On browser action click, we load jQuery and the desaturate plugin, then // call our own flickrnoir.js to desaturate the photo. chrome.browserAction.onClicked.addListener(function(tab) { chrome.tabs.executeScript(null, { file: "jquery.js" }, function() { chrome.tabs.executeScript(null, {file: "jQuery.desaturate.js" }, function() { chrome.tabs.executeScript(null, { file: "flickrnoir.js" }); }) }); }); I've specified permissions for Flickr pages in my manifest.json : "permissions": [ "tabs", "http://www.flickr.com/", "http://*.static.flickr.com/" ] That appears to be working fine, and I can, for example, turn the background of all divs on a Flickr photo page red by adding this to flickrnoir.js , and then opening up a Flickr page and clicking on my extension's button: $("div").css("background-color", "#ff0000"); ...so, I successfully have jQuery loaded and it can successfully access and change DOM elements of a http://*.flickr.com/* page. However, when I try to use the desaturate plugin to desaturate an image (or all images, in fact) I run across a security error. My code: $("img").desaturate(); ...eventually ends up in the jQuery.desaturate plugin's code running this line: var imgPixels = canvasContext.getImageData(0, 0, imgW, imgH); At that point, Chrome throws a security exception: Uncaught Error: SECURITY_ERR: DOM

Tags (comma-separated) Cancel