开始使用Chrome进行开发

时间:2013-05-25 16:38:48

标签: java google-chrome-extension google-chrome-devtools

我的朋友已经要求我为Chrome申请一个应用程序,它要求我提供上下文相关菜单,如下所示:
enter image description here

之前我从未真正为Chrome做过任何事情,我有几个问题:

  1. 我必须开发一个plug-in,对吗?
  2. 如果是这样,我必须遵循一套特定的规则吗?
  3. 我知道我可以使用GWT将Java编译为JavaScript 3.此上下文相关菜单与JPopupMenu相同?

    我想开发的应用程序很简单:
    复制一些文字,
    右键单击,单击上下文相关菜单
    将简单的凯撒密码应用于文本
    在其中打开一个新的JFrame,其中包含JtextArea,以显示加密文字。

2 个答案:

答案 0 :(得分:2)

  1. 您创建的内容称为“extension”,而不是“插件”。浏览器扩展是使用HTML,CSS和Javascript编写的,并且可以访问API以便与浏览器直接交互 另一方面,Plug-ins是已编译的二进制文件,如Flash和Java。

  2. 放弃使用GWT进行Chrome扩展的想法。它使扩展的开发更难,而不是更容易(open issue) 特别是因为你会在the documentation和Stack Overflow中找到大量的vanilla JavaScript示例和教程。

  3. 您只需了解相关的API:

      

    复制一些文字,   右键单击,单击上下文相关菜单

    使用chrome.contextMenus。无需复制,所选文本在回调(examples)中可用。

      

    将简单的Caesar密码应用于文本

    创建一个JavaScript函数来实现这一目标。

      

    在其中打开一个带有JtextArea的新JFrame,以显示加密文本。

    使用chrome.windows.create创建一个新窗口。您可以在扩展程序中添加一个额外的HTML页面,并使用message passing APIs填充文本字段,但由于您似乎是一个完整的新手,我展示了一个简单的复制粘贴方法来创建和填充此窗口:

    function displayText(title, text) {
        var escapeHTML = function(s) { return (s+'').replace(/</g, '&lt;'); };
        var style = '*{width:100%;height:100%;box-sizing:border-box}';
        style += 'html,body{margin:0;padding:0;}';
        style += 'textarea{display:block;}';
        var html = '<!DOCTYPE html>';
        html += '<html><head><title>';
        html += escapeHTML(title);
        html += '</title>';
        html += '<style>' + style + '</style>';
        html += '</head><body><textarea>';
        html += escapeHTML(text);
        html += '</body></html>'
    
        var url = 'data:text/html,' + encodeURIComponent(html);
        chrome.windows.create({
            url: url,
            focused: true
        });
    }
    

    不要忘记阅读Getting started以了解有关扩展程序基础结构的更多信息。

答案 1 :(得分:0)

查看Google Chrome扩展程序Chrome Extensions

入门指南可以帮助您Getting Started

您将找到有关如何使用上下文菜单的部分。