Chrome 扩展：browserAction.onClicked.addListener() 未被调用答案

【问题标题】：Chrome Extension: browserAction.onClicked.addListener() not being calledChrome 扩展：browserAction.onClicked.addListener() 未被调用
【发布时间】：2012-10-03 10:32:06
【问题描述】：

我正在尝试编写一个非常简单的 Chrome 扩展程序。此时只有一个弹出 html 文件，当点击浏览器操作图标时，它会尝试显示警报。我显然做错了什么，因为警报没有触发。

manifest.json

{
  "name": "Simple",
  "description": "Simple",
  "version": "1.0",
  "browser_action": {
    "default_title": "Simple",
    "default_icon": "images/icon.png",
    "default_popup": "popup.html"
  },
  "manifest_version": 2
}

popup.html

<html>
<head>
    <script>
        //Executed when the extension's icon is clicked
        chrome.browserAction.onClicked.addListener(function(tab) 
        { 
            alert("gah");
        });
    </script>
</head>

<body>
    Hello World!
</body>
</html>

我也试过了：

<html>
<head>
    <script>

        function onPageLoad()
        {
            //Executed when the extension's icon is clicked
            chrome.browserAction.onClicked.addListener(function(tab) 
            { 
                alert("gah");
            });
        }

    </script>
</head>

<body onload="onPageLoad()">
    Hello World!
</body>
</html>

根据响应进行更新 谢谢您的答复。我进行了以下更改，但仍未被调用 browser.Action.onClicked() （您可以看到，我正在使用 console.log() 而不是警报。（显示全局范围的日志，内部的日志）回调不是）。

manifest.json

{
  "name": "Simple",
  "description": "Simple",
  "version": "1.0",
  "permissions": ["tabs", "http://*/*", "https://*/*"],
  "background": {
    "persistent": false,
    "scripts": ["popup.js"]
  }, 
  "browser_action": {
    "default_title": "Simple",
    "default_icon": "images/icon.png",
    "default_popup": "popup.html"
  },
  "manifest_version": 2
}

popup.html

<html>
<head>
    <script type="text/javascript" src="popup.js"></script>
</head>

<body>
    <div style="white-space: nowrap">
        Hello World!
    </div>
</body>
</html>

popup.js

console.log("Running at global scope")

//Executed when the extension's icon is clicked
chrome.browserAction.onClicked.addListener(function(tab) 
{ 
    console.log("Running insode of addListener()");
});

【问题讨论】：

标签： javascript google-chrome-extension

【解决方案1】：

chrome.browserAction.onClicked 不能在弹出窗口中使用。这没有多大意义 - 您在点击浏览器操作图标后开始监听它。可以再次单击它，但随后弹出窗口将关闭，并且侦听器将在任何事情发生之前终止。 chrome.browserAction.onClicked 应该在后台页面上使用，并且仅在不使用浏览器操作的弹出窗口时使用：

如果浏览器操作有弹出窗口，则不会触发此事件。

source

你应该只写：

<script>
        alert("gah");
</script>

但我不确定警报是否在弹出窗口中起作用。最好尝试以下方法：

<script>
        document.getElementsByTagName('body')[0].innerHTML = "gah";
</script>

编辑

在您的扩展程序中还有一件事需要修复。正如@Cody 在他的回答中所建议的那样，您不应该使用内联脚本。出于安全原因，它被阻止。将我上面建议的代码放入一个单独的 javascript 文件中，然后将其包含在 popup.htmlhead 中：

<script src='script.js' type='text/javascript'></script>

【讨论】：

是的，做出了改变@KonradDzwinel - 谢谢。不幸的是我仍然有同样的问题。查看我对原始问题的最新更新。（再次感谢您的所有帮助！）
1.您不能在弹出窗口中使用chrome.browserAction.onClicked.addListener。请看我回答的顶部。 2. manifest 中不需要"scripts": ["popup.js"]，我不知道为什么@Cody 建议它。 3.console.log的输出不会显示在主页面devtools中，会显示在弹出的devtools中。要打开弹出式开发工具：打开一个弹出式窗口，右键单击它，选择“检查元素”。

【解决方案2】：

根据修订后的 Chrome 安全策略，Chrome 扩展程序将不再能够在您的 popup.html http://developer.chrome.com/extensions/contentSecurityPolicy.html#jsexecution 中使用内联 JavaScript

您必须创建一个 JS 文件并在 Manifest.json 中说明它的存在，如下所示：

manifest.json

{
  "name": "Simple",
  "description": "Simple",
  "version": "1.0",
  "background": {    
    "scripts": ["bg.js"] //Here you can name the JS file that you have created
  },
  "browser_action": {
    "default_title": "Simple",
    "default_icon": "images/icon.png",
    "default_popup": "popup.html"
  },
  "manifest_version": 2
}

popup.html

<html>
<head>
    <script>
        //Executed when the extension's icon is clicked         
            alert("gah");
    </script>
</head>

<body>
    Hello World!
</body>
</html>

您可以按照 Manifest Version 2 开始构建 Chrome 扩展，参考 http://developer.chrome.com/extensions/overview.html 和 http://developer.chrome.com/extensions/getstarted.html

【讨论】：

这是一个有效的指向！我在回答中错过了这一点。我只是不明白你的例子，background``scripts 与弹出窗口有什么关系？他只需要将弹出脚本放入外部JS文件并包含在popup.html头中即可。
除此之外，您还需要在清单文件中声明您将使用<js-file-name>.js，因为除非在@987654328 中提到该文件，否则它将不允许执行任何外部js文件@
抱歉，我在文档中找不到。仅当我们想在弹出窗口中使用文件时才将其用作后台脚本是没有意义的。另外，我有一个manifest_version:2 扩展名，其中在标头中包含多个js 文件，而manifest.json 中没有提到它们。
感谢大家的回复。我已根据您的建议更新了原始问题。我仍然无法让 onClicked 处理程序执行。