每次单击Chrome扩展程序图标时运行脚本

End*_*age 63 google-chrome google-chrome-extension

如何编写chrome扩展名,以便每次用户单击该图标时,我的脚本都会运行,但是没有打开弹出窗口?(我会在自己的文档中查看这些内容,但无论出于什么原因,他们突然停止工作,404到每一页,我都到了这一点).

我假设它只是正确设置清单.这就是我现在拥有的:

{
  "name": "My Extension",
  "version": "0.1",
  "description": "Does some simple stuff",
  "browser_action": {
    "popup" : "mine.html",
    "default_icon": "logo.png"
  },
  "permissions": [
    "notifications"
  ]
}
Run Code Online (Sandbox Code Playgroud)

aru*_*mar 88

从清单的browser_action部分删除弹出窗口,并在后台脚本中使用后台页面浏览器操作.

chrome.browserAction.onClicked.addListener(function(tab) { alert('icon clicked')});
Run Code Online (Sandbox Code Playgroud)

  • 我究竟在哪里放这个.没有mine.html,扩展中唯一的文件就是清单......好吧,还有图标. (9认同)
  • 如果 manifest.json 中没有 browser_action 部分,那么它将无法工作。你必须在 manifest.json 中添加空的 browser_action: "browser_action": {} (5认同)
  • 请查看背景页面 - http://code.google.com/chrome/extensions/background_pages.html.这就是你在不同页面放置长期运行的代码和代码的地方.上面文档的链接有一个browserAction.onClicked示例 (3认同)

小智 55

首先,如果您不想显示弹出窗口,请"popup" : "mine.html"从您的manifest.json(在您的问题中显示)中删除.

你的manifest.json遗嘱看起来像这样:

{
  "name": "My Extension",
  "version": "0.1",
  "manifest_version" : 2,
  "description": "Does some simple stuff",
  "background" : {
    "scripts" : ["background.js"]
  },
  "browser_action": {
    "default_icon": "logo .png"
  },
  "permissions": ["activeTab"]
}
Run Code Online (Sandbox Code Playgroud)
  • 请注意,manifest_version必须在那里,它必须是2.
  • 请注意,activeTab已添加权限.
  • 请注意,单击浏览器操作按钮时只能执行一项操作:要么可以显示弹出窗口,要么可以执行脚本,但不能同时执行这两项操作.

其次,要在单击图标时执行脚本,请将下面的代码放在您的background.js文件中(文件名在您的文件中指定manifest.json):

chrome.browserAction.onClicked.addListener(function(tab) {
   chrome.tabs.executeScript(null, {file: "testScript.js"});
});
Run Code Online (Sandbox Code Playgroud)

最后,testScript.js您应该在单击图标时放置要执行的代码.

  • 截至2017年2月,此解决方案完全符合原始问题中的要求. (3认同)
  • 太棒了,这项工作对我来说是2018年6月.值得投票!@kerzek肯定是这样的:````js function buttonClicked(tab){var msg = {message:"用户点击!" } chrome.tabs.sendMessage(tab.id,msg); ```` (3认同)
  • 为清楚起见,`onClicked` 侦听器将**仅**在您删除弹出窗口时触发。这是一个或另一个,而不是两者。 (3认同)

R. *_*ung 11

如果你想遵循那么manifest 3你应该这样做:

chrome.action.onClicked.addListener(function (tab) {
    console.log("Hello")
});
Run Code Online (Sandbox Code Playgroud)

进一步注意,您不会Hello在普通控制台中看到 hello,请转到扩展菜单并单击inspect views特定扩展菜单前面的 。

  • 我该把这个放在哪里?background.js 已弃用 (3认同)

Bor*_*mus 5

而不是指定弹出页面,请使用此处chrome.browserAction.onClicked记录的API .


小智 5

您需要添加一个背景文件。但首先你需要在manifest.json中添加一个属性,例如,

"background":{
    "scripts":["background.js"]
}
Run Code Online (Sandbox Code Playgroud)

现在将扩展文件夹中的文件命名为background.js,有一种方法可以将对象从后台发送到内容脚本假设您的内容脚本名为content.js,那么您需要做的就是在background.js文件中编写此代码片段

chrome.browserAction.onClicked.addListener(sendfunc);
function sendfunc(tab){
    msg={txtt:"execute"};
    chrome.tabs.sendMessage(tab.id,msg);
}
Run Code Online (Sandbox Code Playgroud)

上面的代码所做的是将一个名为 msg 的对象发送到内容页,并且该 msg 对象有一个属性 txtt ,它等于“execute”。接下来您需要做的是将内容脚本中的值进行比较

chrome.runtime.onMessage.addListener(recievefunc);
function receivefunc(mssg,sender,sendResponse){
    if(mssg.txtt==="execute"){
      /*  
         your code of content script goes here
      */
    }
}
Run Code Online (Sandbox Code Playgroud)

现在,每当您单击扩展图标时,就会将名为 msg 的对象从后台发送到内容。如果它与将运行的其余代码匹配,函数“recievefunc()”将其 txtt 属性与字符串“execute”进行比较。

注意:msg、txtt、sendfunc、receivefunc、mssg 都是变量,而不是 chrome 关键字,因此您可以使用任何您想要的内容。

希望能帮助到你。

:)