Question

我正在为我的网站制作专门的扩展程序，我想知道是否可以让扩展程序响应仅在我的网站上的特定按钮点击。我希望能够在用户单击页面上的捕获按钮时执行captureVisibleTab。

Answer 1

概述

将Content Script注入相关网页。
将事件监听器附加到按钮。
在该听众中，send a message到背景页面。
在后台标签中，执行captureVisibleTab。

更详细

1）添加内容脚本to your manifest：

"content_scripts" : [{
  "matches": ["*://example.com/path/to/page"]
  "js" : ["content.js"]
}]

2）在内容脚本中（默认情况下会在页面加载后运行），为按钮分配一个监听器：

// content.js
document.getElementById("myButton").addEventListener("click", handler);

3）在该处理程序内，向后台页面发送消息：

// content.js
function handler(){
  chrome.runtime.sendMessage({ myButton : true });
}

4）在后台页面中，侦听该消息并执行所需的代码：

// background.js
chrome.runtime.onMessage.addListener(function(message, sender, sendResponse){
  if(message.myButton) { doStuff(sender); }
});

function doStuff(tab){
  // captureVisibleTab or whatever you want 
}

替代解决方案

正如亚伯拉罕所说，可以使用External Messaging让您的网页自行发送消息。

1）将您的网站添加到"extenrally_connectable"清单字段：

"externally_connectable": {
  "matches": ["*://*.example.com/*"]
}

2）在您的网页中，如果用户安装了您的扩展程序，则会显示chrome.runtime.sendMessage。您需要know your extension's ID才能使用它。

// website.js
if(chrome && chrome.runtime && chrome.runtime.sendMessage) {
  // Installed
  var extensionId = "abcdefghijklmnoabcdefhijklmnoabc";
  chrome.runtime.sendMessage(extensionId, { myButton : true });
  // Maybe do some error-handling in a callback
}

3）在后台，您需要onMessageExternal代替：

// background.js
chrome.runtime.onMessageExternal.addListener(
  function(request, sender, sendResponse) {
    if (sender.url == "http://example.com/path/to/page" && message.myButton) {
      doStuff(sender);
    }
  }
);

在没有pageAction或browserAction的情况下执行扩展操作

1 个答案:

概述

更详细

替代解决方案