Chrome插件取代图像

Question

我目前正在玩Chrome扩展开发。我喜欢猫，我正试图用猫的图片(来源:我的插件，“图片”文件夹)来取代那些使用img标签的网站上的图片。我不太清楚我做错了什么，但图像没有显示(当图像找不到路径时，我得到了正在显示的“损坏”图标)。

这是我的JS文件：

$(document).ready(function() {
    $("div").append('HI THIS IS DOG');  //added this as test and it works - DOGS EVERYWHERE
    var cat = chrome.extension.getURL("cat.jpg");
    $('img').each(function(index, image){  //this produces "broken" icon
        $(image).attr('src', cat);
    });
});

这是我的舱单：

  {
    "manifest_version": 2,
    "name": "I love cats",
    "version": "1",
    "description": "My life is complete, cats everywhere!",
    "browser_action": {
    "name": "I love cats",
    "icons": ["icon.png"],
    "default_icon": "icon.png"
  },
  "content_scripts": [ {
    "css": ["basic.css"],
    "js": [ "jquery-1.12.0.min.js", "contentscript.js" ],
    "matches": [ "http://*/*", "https://*/*"]
  }]
}

我的形象生活在错误的地方吗？还是要我把它加到清单上？我试过用png，但我觉得没什么区别。

Answer 1

您需要将资源声明为网络可访问性。

  "web_accessible_resources": [
    "cat.jpg"
  ],