(Chrome扩展程序)如何从background.html实用地打开弹出窗口

时间:2011-04-04 20:57:01

标签: google-chrome google-chrome-extension

提前致谢!

我想要实现的是当我的扩展程序在网页上检测到特殊标记时打开弹出窗口。搜索一段时间后,似乎只有在用户单击扩展名时才能打开弹出窗口。这是真的吗?

或者我可以在浏览器上获取我的分机图标的位置吗?也许我可以在扩展图标下绘制一个窗口并显示,使其看起来就像弹出窗口一样。

5 个答案:

答案 0 :(得分:12)

如果没有用户点击它就无法打开扩展程序窗口......但是,您可以在新标签页中打开扩展程序弹出页面,如下所示:

1)在您的清单文件中设置background page

"background_page": "background.html",

这是您运行代码以查看是否检测到特殊标记的位置...后台页面可以在后台持续运行代码,您可以设置重复循环以检查变量条件是否为每隔一段时间都是如此......

2)在您的清单文件中启用tabs permission ...

"permissions": [ "tabs" ],

步骤3需要此权限(允许后台页面打开新选项卡)

3)在后台页面中,调用create并指向扩展程序弹出网址。

if(condition == true){
  chrome.tabs.create({url:"popup.html"});
}

答案 1 :(得分:9)

This guy想要相反的效果,无法打开他的弹出窗口。看看他的代码打开你的弹出页面;)

答案 2 :(得分:6)

你不能伪造点击浏览器操作,但你仍然可以像往常一样从后台脚本打开弹出页面,它会按预期工作。例如,您的浏览器操作的html页面是" popup.html"

window.open("popup.html", "extension_popup", "width=300,height=400,status=no,scrollbars=yes,resizable=no");

注意:您只能从后台脚本(事件页面)调用它。因此,您需要在清单文件中注册后台脚本并添加一个事件处理程序,这将打开弹出窗口。您可以在此处阅读有关事件页面的更多信息https://developer.chrome.com/extensions/event_pages

答案 3 :(得分:4)

如果弹出窗口意味着浏览器动作弹出,那么你是对的,没有办法以编程方式打开它。

您可以通过content script直接将弹出窗口中所需的内容直接嵌入到页面中。我认为这将是最好的解决方案。

如果您的弹出窗口中没有任何内容,那么desktop notifications可能就足够了。

创建一个新窗口并将其放在url栏下将是非常尴尬的解决方案,而且不是非常用户友好。

答案 4 :(得分:0)

让我补充一下上面的 devza。如果弹出窗口不需要与页面进行通信,他的回答很好 - 否则您会遇到问题,因为您的内容脚本没有与原始窗口交互。此答案依赖于了解扩展名(发送和接收消息)的页面 - 这意味着您也必须控制页面。我所做的很麻烦,但很管用:

  1. 从页面到后台脚本监听 postMessage,并按照 devza 的建议打开新窗口。
  2. 将原始页面的 url 编码为新窗口的名称(该 url 在消息的事件对象中可用)。
  3. 当您需要从弹出窗口传播回原始页面时,从弹出窗口调用 window.opener.postMessage - 此消息在后台页面的窗口上触发。 消息应包括数据和编码的来源(=window.name)。
  4. 在后台脚本中监听消息。收到消息后,您可以使用 Chrome.tabs api(在 manifest.json 中启用“tabs”权限)来查找相关选项卡 - 通常这将是列表中的第一个选项卡,但现在不是,因为弹出窗口的打开方式。这是编码原点有用的地方 - 遍历 tabs 数组并找到 tab.url===origin 所在的选项卡。
  5. 这是向(=相关内容脚本)发送消息的相关标签。
  6. 内容脚本应侦听所述消息,其中至少应包含数据。
  7. 内容脚本然后可以引发事件/使用相关数据来更新 dom。