如何打开Firefox WebExtension选项页面作为选项卡，从about：addons分开 [英] How to open a Firefox WebExtension options page as a tab, separate from about:addons

问题描述

所以，我浏览了WebExtensions API，但是我一直无法弄清楚如何打开一个独立于的HTML页面：addons 。在附加SDK中，您可以使用 resource：//ext-id-/path/to/file.html 。我试过让一个目录网页可以访问，并把一个HTML文件放在里面，但是这似乎不起作用。

有谁知道如何在WebExtensions中打开选项HTML文件？

解决打开选项卡

选项页总是：

如果您希望您的选项页面始终在选项卡中打开，您可以将 open_in_tab 的值添加到<$ c $ em> $ 到您的 manifest.json 中的 options_ui 键：



 options_ui：{
page：options.html，
open_in_tab：true 
} 
  

这将导致您的选项页面始终在选项卡中打开。从 about：addons 内使用 runtime.openOptionsPage（） 会导致您的选项页面在选项卡中打开。 / p>



感谢 BigBlutHat 提醒我这个选项。 p>



在选项卡中，通常情况下，您的选项页面位于 about：addons ：

您可以使用您希望使用的扩展程序中的任何URL打开一个新选项卡，包括您的选项页面，使用 tabs.create 和 runtime.getURL 。特别是对于位于与您的 manifest.json 相同的目录中的 options.html 文件，以下工作：

  chrome.tabs.create（{
 url：chrome.runtime.getURL（'/ options.html'）
}）; 
  

不需要网络访问和加载JavaScript：

您不需要将这些文件声明为Web访问。该页面在后台上下文中运行，以便通过直接将文件包含在< script> src >标记（例如< script src =/ options.js> ）。这与弹出窗口所做的相同。 此答案有一个扩展名，它使用相同的HTML和JavaScript作为弹出窗口和选项页面。但是，它实际上不会显示打开该页面作为选项卡，但可以用上面的代码完成。

解析相对URL：

Chrome 和 Firefox 状态：

相对URL将是相对于扩展名内的当前页面。

注意：对于所有不同的 chrome。* API调用，Chrome和Firefox并不总是以相同的方式解析相对的URL。例如，对于 chrome.executeScript（） 。

So, I've looked through the WebExtensions API, but I haven't been able to figure out how to open an HTML page separate from about:addons for options. In the Add-on SDK you could have resource://ext-id-/path/to/file.html. I've tried making a directory web accessible and putting an HTML file in there, but that didn't seem to work.

Does anyone know how I can open the options HTML file in it's own tab with WebExtensions?

解决方案

Opening a tab

Options page always in a tab:
If you want your options page to always open in a tab, you can add the property open_in_tab with a value of true to the options_ui key in your manifest.json:

"options_ui" : {
  "page": "options.html",
  "open_in_tab":true
}

This will result in your options page always opening in a tab. Both clicking on your extension's "Options" from within about:addons and using runtime.openOptionsPage() will result in your options page opening in a tab.

Thanks to BigBlutHat for reminding me of this option.

In a tab when normally your options page is within about:addons:
You can open a new tab with whatever URL from within your extension you desire, including your options page, using tabs.create and runtime.getURL. Specifically for an options.html file located in the same directory as your manifest.json, the following works:

chrome.tabs.create({
    url: chrome.runtime.getURL('/options.html')
});

Does not need to be web accessible and loading JavaScript:
You do not need the files to be declared as web accessible. The page runs in the background context so JavaScript is loaded by directly including the files in the src of a <script> tag (e.g. <script src="/options.js">). This is the same as you would do for a popup. This answer has an extension that uses the same HTML and JavaScript as both a popup and an options page. It does not, however, actually show opening that page as a tab, but it could be done with the above code.

Resolving Relative URLs:
Both Chrome and Firefox state:

Relative URLs will be relative to the current page within the extension.

Note: For all the different chrome.* API calls, Chrome and Firefox do not always resolve relative URLs in the same way. For example, it is different in each browser for chrome.executeScript().

这篇关于如何打开Firefox WebExtension选项页面作为选项卡，从about：addons分开的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！