1

我一直在尝试实现Action 命令，以便键盘快捷键将触发background.js中的功能。当前代码在按下键盘快捷键时不会发生任何事情。

理想情况下，键盘快捷键会触发background.js中的函数reddenPage。

我假设一些代码需要放在background.js中，我只是不确定代码应该在哪里或应该是什么。任何帮助深表感谢！

Manifest.json

{
  "name": "Page Redder",
  "action": {},
  "manifest_version": 3,
  "version": "0.1",
  "description": "Turns the page red when you click the icon",
  "permissions": [
    "activeTab",
    "scripting"
  ],
  "background": {
    "service_worker": "background.js"
  },
  "commands": {
    "_execute_action": {
      "suggested_key": {
        "default": "Ctrl+Shift+F",
        "mac": "MacCtrl+Shift+F"
      }
    }
  }
}

background.js

function reddenPage() {
  document.body.style.backgroundColor = 'red';
}

chrome.action.onClicked.addListener((tab) => {
  chrome.scripting.executeScript({
    target: { tabId: tab.id },
    function: reddenPage
  });
});
4

2 回答 2

1

该commandapi 用于侦听和操作键盘快捷键。

清单.json

{
  "name": "My extension",
  ...
  "commands": {
    "run-foo": {
      "suggested_key": {
        "default": "Ctrl+Shift+Y",
        "mac": "Command+Shift+Y"
      },
      "description": "Run \"foo\" on the current page."
    },
    "_execute_action": {
      "suggested_key": {
        "windows": "Ctrl+Shift+Y",
        "mac": "Command+Shift+Y",
        "chromeos": "Ctrl+Shift+U",
        "linux": "Ctrl+Shift+J"
      }
    }
  },
  ...
}

可以添加一个监听器来background.js监听命令。

背景.js

chrome.commands.onCommand.addListener((command) => {
  console.log(`Command: ${command}`);
});

有关键盘快捷键的完整文档。

于 2021-07-04T17:04:21.390 回答
0

lejlun 的回答不正确！正如 Chrome 扩展文档所说：

_execute_action (Manifest V3)、_execute_browser_action (Manifest V2) 和 _execute_page_action (Manifest V2) 命令分别保留用于触发您的操作、浏览器操作或页面操作的操作。这些命令不会像标准命令那样调度 command.onCommand 事件。

您正确地使用了该action.onClicked事件。

问题是在executeScript你写的参数中function而不是func. 根据文档，函数调用应如下所示：

chrome.action.onClicked.addListener((tab) => {
  chrome.scripting.executeScript({
    target: { tabId: tab.id },
    func: reddenPage
  });
});

此外，您尝试变红的页面可能将其背景颜色设置为!important. 在这种情况下，您对背景颜色的更改将无效，因为它将被!important样式覆盖。要确保应用背景颜色，您可以使用document.body.style.setProperty('background-color', 'red', 'important');

于 2021-08-26T17:39:24.757 回答