Chrome 上的打包图像扩展不会在 .append() 上加载

Question

我有一张包含我的扩展程序的图像，我想使用内容脚本将其添加到页面中。我有我的 menu.js 文件，可以正确附加所有内容，但我似乎无法用打包的图像解决它。

我试过了

var loader = chrome.extension.getURL("repo/loader.gif");

还有

var loader = "chrome-extension://" + chrome.runtime.id + "/repo/loader.gif"

以及

var loader = "chrome-extension://__MSG_@@extension_id__/repo/loader.gif";

甚至

var loader = "chrome-extension://" + __MSG_@@extension_id__ + "/repo/loader.gif";

这是要追加的jQuery

$('body').append('<div id="gacHover1"><span>Content is loading</span><img src="' + loader + '" width="470" height="300"></div>');

我错过了什么？

Answer 1

查看 manifest 文件中的 web_accessible_resources 并确保您允许您尝试使用的打包图像。

{
  ...
  "web_accessible_resources": [
    "images/*.png",
    ...
  ],
  ...
}

或者不用 "images/*.png" 只命名您想要的图像，例如 repo/loader.gif。

希望这样

Packed Image on Chrome Extension won't load on .append()