如何在Chrome扩展开发中获得选定的文本? [英] How to get selected text in chrome extension development?

查看:569
本文介绍了如何在Chrome扩展开发中获得选定的文本?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我正在开发一个Chrome扩展,其中涉及获取当前选项卡的选定文本。这里是我使用的html文件:

 <!DOCTYPE html> 
< html lang =en>
< head>
< meta charset =UTF-8>
< title>< / title>
< script>
chrome.tabs.executeScript({
code:window.getSelection()。toString();
,function(selection){
document.getElementById(output ).value = selection [0];
});
< / script>
< / head>
< body>
< div id =output>< / div>
< / body>
< / html>

它不起作用,为什么?接下来是 Chrome应用程序&扩展开发工具,其中一些错误消息会用省略号切开,对不起,我还没有弄清楚如何在这里查看完整的错误消息,查看详细信息仅向我提供堆栈跟踪,不是完整的错误信息。



< img src =https://i.stack.imgur.com/dtk6T.pngalt =在这里输入图片描述>

解决方案

你的原始方法是正确的(可能来自这个问题

a>)。


有两个问题:


  1. 脚本(< script> ...< / script> 是不允许的;它是通过将代码放在单独的文件中来解决的,比如 popup.js


  2. 访问内容脚本注入的页面;在你的具体情况下,有一个特定的权限, activeTab ,它以透明和无痛的方式进行,没有安全警告。当您的扩展程序被调用时(通过点击按钮),您可以访问当前选项卡。


那些固定的,你的直接的方法。



顺便说一下,为了在将来调试这些问题,你需要检查弹出页面






至于你自己的回答,你太过复杂了。



你不需要事件页面就是这种特殊情况;您的弹出窗口可以调用 executeScript 并收听消息。有些情况下,当你做需要它的时候,特别是当你不能保证内容脚本发送消息时弹出是打开的。但在这里您可以保证它。



假设您需要事件页面,请考虑使用 getBackgroundPage $ c>调用一个方法 - 它紧密地耦合代码;您可以改为发送消息。可以使用 sendResponse 将结果返回,即使是异步地

最后,你的模式对于 content.js 来说很混乱。只有一个副本执行,在附加到目标页面的特殊上下文中(而不是在扩展上下文中)。


I'm developing a chrome extension which involves getting selected text of the current tab. Here is the html file that I use:

<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="UTF-8">
        <title></title>
        <script>
            chrome.tabs.executeScript( {
                code: "window.getSelection().toString();"
            }, function(selection) {
                document.getElementById("output").value = selection[0];
            });
        </script>
    </head>
    <body>
        <div id="output"></div>
    </body>
</html>

It doesn't work, why? As followed is the error message from Chrome App & Extension Developer Tool, some of these error messages are cut with ellipses, sorry I haven't figured out how to view the full error messages here, view details only gives me the stack track, not the full error message.

解决方案

Your original approach was correct (and probably taken from this question).

It had 2 problems:

  1. Inline scripts (<script>...</script>) are not allowed; it's fixed by putting code in a separate file, say, popup.js.

  2. You need permission to access a page for content script injection; in your particular case, there's a specific permission, "activeTab", that does it in a transparent and painless way with no security warnings. When your extension is invoked (by clicking on the button), you are given access to the current tab.

With those fixed, your "direct" approach works.

By the way, to debug such problems in future, you need to inspect the popup page.


As for your own answer, you are over-complicating things a lot.

You don't need an Event page is this particular case; your popup can call executeScript and listen to messages. There are cases when you do need it, specifically when you can't guarantee that popup is open when content script sends messages; but here you can guarantee it.

Supposing you need the event page, consider not using getBackgroundPage to call a method in it - it tightly couples code; you can instead send a message. sendResponse can be used to pass the results back, even asynchronously.

Finally, your schema is confusing with respect to content.js. Only one copy of it executes, in a special context that is attached to the target page (and not in the extension context).

这篇关于如何在Chrome扩展开发中获得选定的文本?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆