google-chrome - 如何将灯箱添加到 Chrome 扩展程序中的上下文菜单

Question

我正在构建一个基于上下文菜单的 Chrome 扩展。当用户选择链接或突出显示文本时，将出现扩展名（“contexts”：[“selection”，“link”] ...）。

一旦用户单击所需的选项，我怎么知道要调出灯箱或超薄箱效果以使 iframe 具有基于传递的参数的搜索结果？

示例：在 Chrome 中浏览时在任何页面中选择文本“hello world” >> 右键单击​​以显示我的上下文菜单扩展 >> 已选择选项 1 >> 灯箱或 slimbox 将出现，并且 iframe 显示所选的谷歌搜索结果之前的文字（你好世界）。

Answer 1

以下是如何执行此操作的摘要：

1. 请求必要的权限，例如内容脚本权限
2. 添加上下文菜单项。

3. 在上下文菜单项的 onclick 处理程序中，向内容脚本发送消息，如下所示：

   chrome.tabs.query({active: true, currentWindow: true}, function(tabs) {
       chrome.tabs.sendMessage(tabs[0].id, {"action": "startLightbox"});
    });
   

4. 让内容脚本向页面添加一个灯箱。

   chrome.runtime.onMessage.addListener(
      function(request, sender, sendResponse) {
         if ( request.action == "startLightbox" ) {
            //code for lightbox here
         }
       })
   

当我试图自己弄清楚时，我遇到了你的问题。一旦我想通了，我想我会分享它。这是我的教程，里面有详细的说明。