我如何从 Web 扩展弹出窗口 JavaScript 知道浏览器是 Chrome 还是 Firefox？

Question

我正在为 Chrome 和 Firefox 使用 chrome 命名空间，但想知道哪个浏览器是运行网络扩展。

Answer 1

检查 Firefox 中没有的 chrome.app:
```
const isFirefox = !chrome.app;
```
检查 Chrome 中不存在的 browser:
```
const isFirefox = window.browser && browser.runtime;
```
（额外的检查是为了避免在具有 id="browser" 的元素的页面上出现误报，该元素在 window 对象上为此元素创建了命名的属性）
使用异步browser.runtime.getBrowserInfo.

P.S。 navigator.userAgent 可能会在切换到设备模式或通过 Firefox 中的 about:config 选项进行调试时在 devtools 中进行更改，因此它是一个不可靠的来源。

Answer 2

这是我在自己的扩展程序中所做的，以检查 Firefox (FF) 与 Chrome:

const FF = typeof browser !== 'undefined';

更新： (1)
这里有一个解释.....

I am using the chrome namespace for both Chrome and Firefox, but would like to know which browser is running the web extension.

AFA 我明白了，问题涉及扩展代码而不是内容代码。我在 "firefox-webextensions" 或 "google-chrome-extension" 后台脚本中的后台脚本中使用以上代码。

从那时起代码将是：

if (FF) {...}
else { .... }

一旦建立，内容脚本就没有任何影响。

如果开发人员以某种方式决定使用 id="browser"，则可以添加进一步的步骤，即 returns 布尔值 true|false 例如

const FF = typeof browser !== 'undefined' && !!browser.runtime;

下面的 returns 是 object 或 undefined 而不是布尔值

const isFirefox = window.browser && browser.runtime;

虽然它在 if() 条件中工作正常，但在其他需要布尔值的情况下无法工作（例如 switch）

(1) 注意： 标记答案，阻止人们在以后花时间和精力回答问题。

Answer 3

指向扩展资源的链接在 Chrome 和 Firefox 中有不同的方案。

const isFirefox = chrome.runtime.getURL('').startsWith('moz-extension://');
const isChrome = chrome.runtime.getURL('').startsWith('chrome-extension://');

我如何从 Web 扩展弹出窗口 JavaScript 知道浏览器是 Chrome 还是 Firefox？

How can I know if browser is Chrome vs Firefox from web extension popup JavaScript?

google-chrome-extension

firefox-addon-webextensions