Question

尝试制作Chrome扩展程序，出于某些原因，我必须从其他地方托管的网址加载图片......

{
  "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

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

Answer 2

您可以在运行时将数据作为图像标记加载，然后将其粘贴到画布对象中，提取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";

Chrome扩展程序：来自网址的图标

2 个答案: