在Chrome扩展插入图像

Question

我想知道如何在Chrome扩展插入图像。

<img id="image" src="logo.png" /> 

我将该html标签正确地插入网站，但自然无法加载该logo.png图像。

关于如何修改manifest.json的任何想法？

Answer 1

该问题有两种可能的原因。

1. 您正在用src="logo.png"注射图像。插入的图片元素成为页面的一部分，因此浏览器不会尝试从加载来自扩展名的图像。
   要解决此问题，请使用chrome.extension.getURL('logo.png');获取资源的绝对URL。

2. "manifest_version": 2在清单文件中启用。这会默认禁用所有资源以供外部使用。出现此错误时，出现在控制台以下消息：

   不允许加载本地资源：铬：//gbmfhbpbiibnbbgjcoankapcmcgdkkno/logo.png

   为了解决这个问题，将资源添加到白名单，即"web_accessible_resources"清单文件：

   ..., 
       "web_accessible_resources": ["logo.png"] 
   }