2

我正在尝试将我的 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");
    }
}

文件:清单.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) 将所选文本替换为函数的输出。上面的代码不起作用,说找不到“modifySelection”。

(3) 如果我的函数位于不同的 (file2.js) 文件中,如何调用它们。目前我将所有函数都放在一个文件中(myscript.js)。

(4) 如何在菜单中创建菜单。

我试图在谷歌上搜索,但找不到上述解决方案。谁能帮帮我吗。

-莫汉

4

1 回答 1

1

(1) 我的 init() 函数(它应该只运行一次来​​初始化我的插件全局变量)应该放在哪里?

根据您的要求,有两个事件应满足您的初始化需求:

chrome.runtime.onInstalled

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

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

chrome.runtime.onStartup

当安装了此扩展的配置文件首次启动时触发。启动隐身配置文件时不会触发此事件,即使此扩展程序在“拆分”隐身模式下运行也是如此。

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


(2) 将所选文本替换为函数的输出。上面的代码不起作用,说找不到“modifySelection”。

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

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

(Note: It will only work properly if the selection involves TextNodes only. In other cases it might break the DOM, so more detailed parsing of the selection is required.)


(3) 如果我的函数位于不同的 (file2.js) 文件中,如何调用它们。目前我将所有函数都放在一个文件中(myscript.js)。

您注入所有必要的文件,然后像往常一样调用函数。即所有注入的内容脚本都在同一个JS上下文中执行。例如:

"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;这使该项目成为先前添加的项目的子项。

另请参阅这个演示扩展,它(除其他外)正是这样做的。


最后的一些评论

  1. chrome.extension.onMessage已弃用。请改用chrome.runtime.onMessage

  2. 尽可能尝试使用事件页面(而不是背景页面)。

于 2013-11-04T09:34:36.330 回答