Question

我正在尝试将我的firefox插件移植到chrome，这是我的示例代码。

文件：myscript.js（部分）

.
.
function init() {
  .
  .
  .
}
function myFunc(inp, option) {
  .
  .
  .
}

chrome.extension.onMessage.addListener(function (message, sender, response) {
    switch (message) {
        case "ITRANS":
            console.log("ITRANS");
            if (document.getSelection().baseNode != null){ 
                init();
                window.modifySelection(myFunc(window.getSelection().toString(), 0)); 
            }
            break;
        case "Devanagari":
            console.log("Devanagari");
            if (document.getSelection().baseNode != null){ 
                init();
                window.modifySelection(myFunc(window.getSelection().toString(), 1)); 
            }
            break;
        default:
            console.log("Default");
    }
});

档案：background.js

var _selection_univ = chrome.contextMenus.create({
    "title": "INDIC 2 ITRANS",
    "id": "ITRANS",
    "onclick": reportclick,
    "contexts": ["selection"]
}, function () {
    console.log("Context Menu 1 ITRANS");
});
var _selection_univ = chrome.contextMenus.create({
    "title": "Eng 2 Devanagari",
    "id": "Devanagari",
    "onclick": reportclick,
    "contexts": ["selection"]
}, function () {
    console.log("Context Menu 2 Devanagari");
});

function reportclick(info, tab) {
    switch (info.menuItemId) {
        case "ITRANS":
        console.log("BG: ITRANS");
            chrome.tabs.sendMessage(tab.id, "ITRANS");
            break;
        case "Devanagari":
        console.log("BG: Devanagari");
            chrome.tabs.sendMessage(tab.id, "Devanagari");
            break;
        default:
            console.log("BG: Default");
    }
}

文件：manifest.json

{
  "name": "Parivartan",
  "version": "0.8.2",
  "manifest_version": 2,
  "permissions":[
    "contextMenus",
    "<all_urls>",
    "tabs"
  ],
  "content_scripts": [
    {
      "matches": ["<all_urls>"],
      "js": ["myscript.js"],
      "all_frames": true
    }
  ],
  "background": {
    "scripts": ["background.js"]
   }
}

我无法弄清楚一些事情。

（1）我的init（）函数应该放在哪里（它应该只运行一次以初始化我的插件全局变量）。

（2）用函数的输出替换所选文本。上面的代码不起作用，说“找不到修改选择”。

（3）如果函数位于不同的（file2.js）文件中，如何调用它。目前，我将所有功能都放在一个文件中（myscript.js）。

（4）如何在菜单中创建菜单。

我试图在谷歌上搜索但无法找到上述解决方案。任何人都可以帮助我。

-Mohan

Answer 1

（1）我的init（）函数（应该只运行一次以初始化我的插件全局变量）应放在哪里？

根据您的要求，有两个事件应该涵盖您的初始化需求：

chrome.runtime.onInstalled ：

首次安装扩展程序时，扩展程序更新为新版本以及Chrome更新为新版本时触发。

例如：chrome.runtime.onInstalled.addListener(function() {...});

chrome.runtime.onStartup ：

首次安装此扩展程序的配置文件启动时触发。启动隐身配置文件后，即使此扩展程序以“拆分”隐身模式运行，也不会触发此事件。

例如：chrome.runtime.onStartup.addListener(function(details) {...});

（2）用函数的输出替换所选文本。上面的代码不起作用，说“找不到修改选择”。

这是因为未定义函数modifySelection。你从哪里得到那个名字？的更新：
根据OP在评论中的反馈，一个简单的modifySelection()函数可能如下所示：

function modifySelection(newValue) { var range = document.getSelection().getRangeAt(0); range.deleteContents(); range.insertNode(document.createTextNode(newValue)); }

（注意：如果选择仅涉及TextNodes，它将只能正常工作。在其他情况下，它可能会破坏DOM，因此需要更详细的解析选择。）

（3）如果我的函数位于不同的（file2.js）文件中，如何调用它。目前，我将所有功能都放在一个文件中（myscript.js）。

您注入所有必需的文件，然后像往常一样调用这些函数。即所有注入的内容脚本都在相同的JS上下文中执行。 E.g：

"content_scripts": [{ "matches": ["<all_urls>"], "js": ["file1.js", "file2.js", ...], "all_frames": true }],

在file1.js：

... function funcInFile1() {...} ...

在file2.js：

... var res = funcInFile1(); ...

（注意：内容脚本按照它们出现在“js”数组中的顺序注入。确保每个资源在调用之前都可用。例如，尝试调用funcInFile1()在注入file1.js之前会导致错误。）

（4）如何在菜单中创建菜单。

如果您的意思是“创建子菜单”，则可以在 chrome.contextMenus.create的 createProperties 参数中包含parentId属性功能：

<强> parentId的：
父菜单项的ID;这使该项成为先前添加项的子项。

另请参阅此 demo extension ，其中包括（以及其他内容）。

最后一些评论

chrome.extension.onMessage 已弃用。请改为使用 chrome.runtime.onMessage 。

尽可能尝试使用 Event Pages （而不是背景页面）。

chrome-extension替换所选文本

1 个答案: