google-chrome-extension - Chrome 扩展程序：来自 URL 的图标

Question

尝试制作 Chrome 扩展程序，由于某些超出我的原因，我必须从托管在其他地方的 url 加载图像......

{
  "name": "Name",
  "version": "1.0",
  "manifest_version": 1,
  "description": "A something something something",
  "browser_action": {
    "default_icon": "favicon.ico",
    "default_popup": "popup.html"
  },
  "icons": {
    "128": "logo_white.gif"
    }

}

如何从http://www.example.com/favicon.ico和http://www.example.com/logo_white.gif加载 favicon.ico 和 logo_white.gif ？我很困惑，因为我对 chrome 扩展及其对 JSON 的使用相当陌生。

谢谢

Answer 1

您可以在运行时将数据作为图像标签加载，然后将其粘贴到画布对象中，提取 ImageData 并将其传递给setIcon API。

在 background.js 中像下面这样的东西可以解决问题：

var canvas = document.createElement("canvas");
var img = new Image();
img.onload = function() {
  document.body.appendChild(canvas);
  var context = canvas.getContext("2d");
  context.drawImage(this, 0, 0);
  var imageData = context.getImageData(0, 0, img.width, img.height);
  chrome.browserAction.setIcon({imageData: imageData});
}
img.src = "http://www.example.com/logo_white.gif";

Answer 2

您不能使用位于扩展程序之外的图标。您的扩展程序将安装在本地计算机上，当没有可用的 Internet 连接时，Google Chrome 应该能够获取您的扩展程序的图标。