Chrome 扩展:如何使用 <all_urls> 将 HTML 注入到任何标签中

问题描述

我正在尝试在计时器完成后将内容脚本注入用户的当前选项卡。因此,我的清单是:

"content_scripts": [{
    "matches": ["<all_urls>"],"js": ["jquery-3.5.1.min.js","flipclock-min.js","content.js"],"css": ["normalize.min.css","styles2.css","flipclock.css","css.css"]
}]

根据网店发布流程:

  • 广泛的主机权限

与其请求广泛的主机权限,不如考虑使用 activeTab 权限,或指定您的扩展程序需要的站点 进入。这两个选项都比允许完全访问更安全 不确定数量的网站,它们可能有助于最大限度地减少审查 次。

activeTab 权限允许访问选项卡以响应 明确的用户手势。

{
...
"permissions": ["activeTab"]
}

对我来说使用 activeTab 是有意义的。但是,正如他们所提到的,我可以在许可下使用它而不是 content_scripts 否则我会得到:

Invalid value for 'content_scripts[0].matches[1]': Missing scheme separator.

我应该怎么做?

解决方法

activeTab 不会完全自动在计时器上工作,因为它需要一个明确的用户操作:用户必须点击您的扩展程序图标(或通过 commands API 热键进行交互, contextMenus API 菜单或 omnibox API 关键字(documentation 中的更多信息)以启动或设置计时器。

通过此类用户操作,activeTab 将授予对当前选项卡的访问权限,因此您的后台脚本可以使用 chrome.tabs.executeScript 注入脚本(每个脚本使用一次调用)。

并且,删除 manifest.json 中的 content_scripts