我正在尝试编写一个JavaScript函数,它可以像单击扩展图标一样打开扩展。我知道如何在新标签页中打开扩展:
var url = "chrome-extension://kelodmiboakdjlbcdfoceeiafckgojel/login.html"; window.open(url);
但是我想在浏览器的右上角打开一个弹出窗口,就像点击扩展图标一样。
mcvgt66p1#
Chromium开发团队已经明确表示不会启用此功能。请参阅Feature request: open extension popup bubble programmatically:浏览器和页面操作弹出窗口的理念是它们必须由用户操作触发。我们的建议是使用新的html通知功能...Desktop notifications可以通过编程的方式向用户显示一个类似于弹出窗口的小HTML页面,它不是一个完美的替代品,但它可能提供了您需要的功能类型。
sirbozc52#
Chrome团队 * 确实 * 创建了一个以编程方式打开弹出窗口的方法,但出于安全考虑,它只作为一个私有API和plans to make it generally available have stalled启用。所以,截止到2018年3月截止到现在,还是不行。
ibps3vxo3#
简短的回答是你不能以编程方式打开browserAction。但是你可以用你的内容脚本创建一个dialog来模拟你的browserAction,并显示它是ntead(以编程方式)。但是你不能像从popup.html那样直接从这个弹出窗口访问你的扩展的background page。你必须使用pass message来代替你的扩展。
browserAction
dialog
popup.html
background page
pass message
xn1cxnb44#
如前所述,没有用于此目的的公共API。
我想到的一个解决方案是通过单击按钮将扩展作为content script中的iframe启动,这样后台脚本将向内容脚本发出扩展URL,将其设置为iframe的src,如下所示。
iframe
src
browser.runtime.onMessage.addListener((request) => { if (request.open) { return new Promise(resolve => { chrome.browserAction.getPopup({}, (popup) => { return resolve(popup) }) }) } })
const i = document.createElement('iframe') const b = document.createElement('button') const p = document.getElementById('some-id') b.innerHTML = 'Open' b.addEventListener('click', (evt) => { evt.preventDefault() chrome.runtime.sendMessage({ open: true }, (response) => { i.src = response p.appendChild(i) }) }) p.appendChild(b)
这将在运行脚本的页面的DOM中打开扩展。您还需要将下面的添加到清单中。
.... "web_accessible_resources": [ "popup.html" ] ....
vm0i2vca5#
您可以通过在页面上与弹出窗口相同的位置显示一个固定的html元素来模拟弹出窗口,并将其样式设置为类似于弹出窗口。
vddsk6oq6#
我也有同样的要求:当用户点击扩展图标时,一个小的弹出窗口会打开。在我的例子中,我写了一个扩展,当图标被点击时,它会给予选择性股票的更新。这是我的弹出窗口看起来的样子。
如果您有相同的要求,请阅读下面的答案。这是我的manifest.json文件的外观。
manifest.json
所有繁重的工作都是由manifest.json文件处理的。有一个browser_action部分,其中有一个名为default_popup的键,只需输入您希望弹出窗口显示的HTML文件的名称。我希望我的扩展可以在所有页面上工作,这就是为什么我在content_scripts下添加了属性matches。我真的不需要把jquery文件jquery-3.2.1.js放在js数组中,但是扩展管理器不允许我保持该数组为空。希望这有帮助,做评论,如果你有任何疑问的答案。
browser_action
default_popup
content_scripts
matches
jquery-3.2.1.js
js
6条答案
按热度按时间mcvgt66p1#
Chromium开发团队已经明确表示不会启用此功能。请参阅Feature request: open extension popup bubble programmatically:
浏览器和页面操作弹出窗口的理念是它们必须由用户操作触发。我们的建议是使用新的html通知功能...
Desktop notifications可以通过编程的方式向用户显示一个类似于弹出窗口的小HTML页面,它不是一个完美的替代品,但它可能提供了您需要的功能类型。
sirbozc52#
Chrome团队 * 确实 * 创建了一个以编程方式打开弹出窗口的方法,但出于安全考虑,它只作为一个私有API和plans to make it generally available have stalled启用。
所以,截止到2018年3月截止到现在,还是不行。
ibps3vxo3#
简短的回答是你不能以编程方式打开
browserAction
。但是你可以用你的内容脚本创建一个dialog
来模拟你的browserAction
,并显示它是ntead(以编程方式)。但是你不能像从popup.html
那样直接从这个弹出窗口访问你的扩展的background page
。你必须使用pass message
来代替你的扩展。xn1cxnb44#
如前所述,没有用于此目的的公共API。
我想到的一个解决方案是通过单击按钮将扩展作为content script中的
iframe
启动,这样后台脚本将向内容脚本发出扩展URL,将其设置为iframe的src
,如下所示。这将在运行脚本的页面的DOM中打开扩展。您还需要将下面的添加到清单中。
vm0i2vca5#
您可以通过在页面上与弹出窗口相同的位置显示一个固定的html元素来模拟弹出窗口,并将其样式设置为类似于弹出窗口。
vddsk6oq6#
我也有同样的要求:当用户点击扩展图标时,一个小的弹出窗口会打开。在我的例子中,我写了一个扩展,当图标被点击时,它会给予选择性股票的更新。这是我的弹出窗口看起来的样子。
如果您有相同的要求,请阅读下面的答案。
这是我的
manifest.json
文件的外观。所有繁重的工作都是由
manifest.json
文件处理的。有一个browser_action
部分,其中有一个名为default_popup
的键,只需输入您希望弹出窗口显示的HTML文件的名称。我希望我的扩展可以在所有页面上工作,这就是为什么我在
content_scripts
下添加了属性matches
。我真的不需要把jquery文件jquery-3.2.1.js
放在js
数组中,但是扩展管理器不允许我保持该数组为空。希望这有帮助,做评论,如果你有任何疑问的答案。