检测浏览器扩展是否在 Chrome 或 Firefox 上运行的最佳实践？ [复制]

Question

我编写了一个 Chrome 扩展程序，并将其迁移到其他浏览器，如 Firefox 和 Edge。但是，Firefox 上的 WebExtensions API 与 Chrome 的 API 有一些不同。

所以我必须检测我应该使用回调风格的 API（在 Chrome 中，以及在 Edge 中）还是 Promise 风格的 API（在 Firefox 中）。

例如：

if(RUNNING_ON_CHROME)
    chrome.permissions.request({
        permissions: ...,
        origins: ...,
    }, function(result) { // callback-style
        ...
    });
else // running on firefox
    browser.permissions.request({
        permissions: ...,
        origins: ...,
    }).then(function(result) { // promise-style
        ...
    });

我想知道如何执行RUNNING_ON_CHROME 测试。是查看UserAgent中的相关字符串，还是查看browser!==undefined？

ps。 Edge 使用 browser.* API，但它的 API 是回调样式的。

Answer 1

截至目前，您可以依赖browser 和chrome：

（自从切换到基于 Chromium 的引擎后，不再用于检测 Edge）

function getBrowser() {
  if (typeof chrome !== "undefined") {
    if (typeof browser !== "undefined") {
      return "Firefox";
    } else {
      return "Chrome";
    }
  } else {
    return "Edge";
  }
}

一方面，每次要调用 API 时都使用它会充满样板；您可以填充其中一个（例如，在 Chrome 中使用webextension-polyfill 来获取browser）并只使用一个。

另一方面，在实现上存在真正的差异（即使你得到相同的签名），所以你需要上面的浏览器检测来分离一些逻辑。