background.js 中的 Chrome 扩展 keydown 监听器答案

【问题标题】：Chrome extension keydown listener in background.jsbackground.js 中的 Chrome 扩展 keydown 监听器
【发布时间】：2016-04-20 09:40:49
【问题描述】：

我正在创建一个扩展程序，允许用户在 Vivaldi 浏览器上使用类似 chrome 的选项卡切换。

在我的 background.js 中我尝试过

addEventListener("keydown", function(e) {
    console.log(e.code); // never gets here
})

我最初由 content.js 脚本处理事件，但是这需要完全加载任何新选项卡，然后我才能将消息发送到 background.js 脚本

function Listener()
{
    this.stage = 0;
    this.listen();
}

Listener.prototype.listen = function()
{
    addEventListener("keydown", this.handleKeyDown);
    addEventListener("keyup", this.handleKeyUp);
}

Listener.prototype.handleKeyDown = function(event)
{
    for(var i = 0; i < 9; i++) {
        if(event.ctrlKey) {
            if(event.code == "Digit" + (i + 1)) {
                chrome.runtime.sendMessage({
                    greeting: i
                }, function(response) {
                    console.log(response);
                })
            }
        }
    }
}
new Listener();

我想将此功能移至我的 background.js，以便它独立于浏览器操作运行。

【问题讨论】：

只有内容脚本才能访问与 DOM 相关的内容，即使发生在当前网页上，您的意思是“这需要完全加载任何新选项卡，然后我才能将消息发送到 background.js 脚本”？您希望什么时候执行您的脚本？
无论加载了哪些选项卡，我都希望执行我的脚本@HaibaraAi - 它是一个选项卡切换器，所以如果我打开一个新选项卡，我希望能够使用组合键切换回选项卡一个，例如 ctrl + 1，我可以这样做，但我只需要等待新选项卡首先加载。
那么我相信@Xan 是对的，chrome.commands 就是为了这个目的，尽管许多限制，例如所有组合键都必须包含 Ctrl 或 Alt，...。

标签： javascript google-chrome google-chrome-extension

【解决方案1】：

DOM 键盘事件侦听器仅捕获焦点在页面内时发生的击键。

无法显示背景页面，因此无法获得焦点。它永远不会收到任何输入事件。

您可能想查看chrome.commands API，但它相当严格。有一个很好的理由：您真的，真的不希望扩展能够只收集所有击键。

您可以通过使用（有效）命令调用您的扩展程序来部分绕过限制，这将打开其弹出窗口，进而可以使用 DOM 侦听器捕获更多事件。

【讨论】：

我明白这一点 - 但是，依赖 DOM 事件需要先加载新选项卡，然后才能切换回另一个选项卡；例如：您打开一个新选项卡 (ctrl + t) - content.js 脚本启动并在您加载网页时开始侦听请求，但那时 ctrl + 1/2/3/4.. 赢了'不会被听众拾起以切换到相应的选项卡。 @Xan
那是因为当语义上你希望它们在浏览器中的任何地方工作时，整个“试图通过内容脚本收集击键”是一种黑客行为。它不会可靠地工作，期间。你确实有一个工具 - chrome.commands - 用于浏览器范围的快捷方式，但它有你必须忍受的限制。
请注意，我对允许使用哪种快捷方式有详细的回答：stackoverflow.com/a/28410213/934239 例如，您不能覆盖 Chrome 现有的快捷方式。