页面操作按钮图标在运行内容脚本的URL上显示为灰色

Question

我写了一个Chrome扩展,其中包含manifest.json中的以下行 (我只删除了名称和描述元数据):

"permissions":[],
"content_scripts":[
    {
        "run_at":"document_start",
        "matches":[
            "https://www.amazon.de/*",
            "https://www.amazon.it/*",
            "https://www.amazon.co.uk/*",
            "https://www.amazon.es/*",
            "https://www.amazon.fr/*"
        ],
        "js":[
           "jquery-1.10.2.min.js", "schnapperama.js"
        ]
    }
],
"background": {
    "persistent": false,
    "scripts": ["background.js"]
},
"options_page": "options/index.html",
"icons":{
    "16":"options/img/schnapper16.png",
    "48":"options/img/schnapper48.png",
    "128":"options/img/schnapper128.png"
},
"page_action":{
    "default_icon":"options/img/schnapper38.png"
},
"web_accessible_resources":[],
"content_security_policy":"script-src 'self'  https://www.amazon.de; object-src 'self'",
"content_security_policy":"script-src 'self'  https://www.amazon.it; object-src 'self'",
"content_security_policy":"script-src 'self'  https://www.amazon.fr; object-src 'self'",
"content_security_policy":"script-src 'self'  https://www.amazon.es; object-src 'self'",
"content_security_policy":"script-src 'self'  https://www.amazon.co.uk; object-src 'self'"

如您所见,它有一page_action组,也有一些matches输入.

如果我进入matches我脚本中提到的任何网站成功运行.尽管如此,我的扩展程序的图标在这些页面上保持灰色.

我错过了什么？

Answer 1

您必须调用chrome.pageAction.show()才能使页面操作按钮处于活动状态(图标不会显示为灰色).显示(启用)pageAction按钮不会自动与运行内容脚本的页面关联.

来自Chrome的pageAction页面(强调我的):

使用pageAction.show和pageAction.hide方法分别显示页面操作并显示为灰色.默认情况下,页面操作显示为灰色.显示时,指定应显示图标的选项卡.图标保持可见,直到选项卡关闭或开始显示不同的URL(例如,因为用户单击链接).

从您构建扩展程序的方式来看,最好的办法是让您的内容脚本向chrome.runtime.sendMessage()后台脚本发送消息,告诉它显示相关选项卡的页面操作图标.

它可能是这样的:

后台脚本:

chrome.runtime.onMessage.addListener(function(message, sender, sendResponse) {
    if (message.type === 'showPageAction') {
        chrome.pageAction.show(sender.tab.id);
    }
});

内容脚本:

chrome.runtime.sendMessage({type:'showPageAction'});