键盘绑定在Chrome扩展内容脚本与GMail

Keyboard bindings in Chrome Extension content script with GMail

本文关键字：脚本 GMail 扩展 绑定 Chrome 键盘      更新时间：2023-09-26

我正在创建一个Chrome扩展，使用键绑定(即将使用javascript keydown和keyup事件处理程序)通过内容脚本。不过，我在尝试将此功能与GMail一起使用时遇到了一个障碍。

以下代码(内容脚本)中的处理程序函数似乎只有在我通过GChat与某人聊天时才会触发:

$(window).bind('keydown', function(e){console.log('yay!');});

不幸的是，它似乎没有激活任何其他地方，包括当我试图发送电子邮件。我查看了GMail网页源代码，结果发现所有实际显示的内容都驻留在id为canvas_frame的iFrame中，所以我尝试了这个:

$('#canvas_frame').content().live('keydown', function(e){console.log('yay!');});

: 

$('#canvas_frame').content().find('body').live('keydown', function(e){
  console.log('yay!');
});

不幸的是，这也不起作用。

我的manifest.json看起来像这样:

{
  "name": "extension",
  "version": "1.0",
  "description": "description",
  "background_page": "background.html",
  "content_scripts": [
    {
      "matches": ["http://*/*", "https://*/*"],
      "css": [],
      "js": [ 
              "main.js"
            ]
    }
  ],
  "all_frames": true,
  "permissions": [
    "http://*/*", "https://*/*"
  ]
}

我想知道是否有人知道发生了什么，用GMail做这件事的正确方法是什么，如果$('#canvas_frame').content().live(...)是正确的方法。

谢谢!

您的all_frames参数在清单中放错了位置，它应该是:

"content_scripts": [
    {
      "matches": ["http://*/*", "https://*/*"],
      "all_frames": true,
      "js": ["main.js"]
    }
],

我会通过将内容脚本注入iframes本身并在那里进行所有键绑定来解决这个问题。识别这些iframe的url，并向每个iframe注入单独的内容脚本。例如:

"content_scripts": [
    {
      "matches": ["http://gmail.com/*"],
      "all_frames": false,
      "js": ["main.js"]
    },
    {
      "matches": ["http://gmail.com/iframe1.html"],
      "all_frames": true,
      "js": ["iframe1.js"]
    },
    {
      "matches": ["http://gmail.com/iframe2.html"],
      "all_frames": true,
      "js": ["iframe2.js"]
    }
],
相关文章：