如何确定您的扩展后台脚本在哪个浏览器中执行? [英] How to determine in which browser your extension background script is executing?

本文介绍了如何确定您的扩展后台脚本在哪个浏览器中执行?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我在谈论Chrome扩展,Firefox WebExtensions,Edge扩展......

在后台脚本中,不是内容脚本,是否存在清晰的方式知道我正在使用哪个浏览器?我需要为不同的浏览器执行不同的操作。



是, navigator.userAgent 可能很有用,但它不是很清楚



是否有任何可用于执行此操作的扩展API?就像 chrome.extension.browserType 。 (当然,这个并不存在..)

解决方案

没有特定的API来检测当前哪个浏览器正在使用。主要浏览器支持通用扩展框架的好处之一是可以拥有支持多种浏览器的单一代码库。尽管所有适用的浏览器都提供了一套功能,但总会有一些差异。这些差异不仅仅在于支持的内容,而且在某些特定的API的效果的细节中,或API的使用方式也不尽相同。 1, 2 因此,对于某些事情,有必要能够确定代码当前正在运行哪个浏览器。



有一些很好的代码可以从 top-top回答如何检测Safari,Chrome,IE,Firefox和Opera浏览器?。但是,它需要一些修改才能在扩展环境中工作。



根据该答案中的代码,以下代码将检测到:


  • Chrome

  • 边缘

  • Firefox

  • Opera

  • Bink引擎



// Opera 8.0+(在Opera 42.0上测试)
var isOpera =(!! window.opr&& !! opr.addons)|| !! window.opera
|| navigator.userAgent.indexOf('OPR /')> = 0;

// Firefox 1.0+(在Firefox 45-53上测试)
var isFirefox = typeof InstallTrigger!=='undefined';

// Internet Explorer 6-11
//未在IE上测试(当然)。这里是因为它显示了isEdge的一些逻辑。
var isIE = / * @ cc_on!@ * / false || !document.documentMode;

// Edge 20+(在边缘38.14393.0.0上测试)
var isEdge =!isIE&& !! window.StyleMedia;

// Chrome 1+(在Chrome 55.0.2883.87上测试)
//这不适用于扩展名:
// var isChrome = !! window.chrome& amp ;&安培; !window.chrome.webstore;
//其他浏览器试图更像Chrome,因此选择Chrome中的
//功能,但不能在其他浏览器中使用
//目标。如果未检测到其他人,则默认为Chrome。
var isChrome =!isOpera&& !isFirefox&& !isIE&& !isEdge;

//闪烁引擎检测(在Chrome 55.0.2883.87和Opera 42.0上测试)
var isBlink =(isChrome || isOpera)&& !window.CSS;

/ *以上代码基于以下代码:https://stackoverflow.com/a/9851769/3773011 * /
//验证:
var log = console .LOG;
if(isEdge)log = alert; //边缘console.log()不起作用,但alert()会。
log('isChrome:'+ isChrome);
log('isEdge:'+ isEdge);
log('isFirefox:'+ isFirefox);
log('isIE:'+ isIE);
log('isOpera:'+ isOpera);
log('isBlink:'+ isBlink);







  1. 一个API可以与不同浏览器的复杂而多样的接口相结合,至少 ,实现之间的细微差别。目前,许多差异并不那么微妙。

  2. Mozilla明确表示,他们打算通过扩展 chrome。* / 浏览器。* API。这种做法的一种方式是,有一种机制称为 WebExtensions Experiments 适用于非Mozilla开发人员为WebExtensions实现附加功能。目的是,如果获得批准,此类功能将被迁移到Firefox构建的库存中。


I'm talking about Chrome extensions, Firefox WebExtensions, Edge extensions...

In a background script, not a content script, is there a clear way to know which browser I am using? I need to do different operations for different browsers.

Yes, navigator.userAgent can be useful, but it's not very clear.

Is there any extension API that can be used to do this? Something like, chrome.extension.browserType. (Of course, this one doesn't really exist..)

解决方案

There is no specific API to detect which browser is currently being used. One of the benefits of the major browsers moving to support a common extension framework is being able to have a single codebase which supports multiple browsers. While the set of functionality which is available from all applicable browsers is growing, there will always be some differences. These differences are not just in what is supported, but in some cased are in the specifics of the effects for a particular API, or how the API must be used.1,2 Thus, for some things, it is necessary to be able to determine which browser the code is currently running.

There is some good code available from the top-voted answer to "How to detect Safari, Chrome, IE, Firefox and Opera browser?". However, it needs some modification to work in an extension environment.

Based on the code in that answer, the following will detect:

  • Chrome
  • Edge
  • Firefox
  • Opera
  • the Bink engine

// Opera 8.0+ (tested on Opera 42.0)
var isOpera = (!!window.opr && !!opr.addons) || !!window.opera 
                || navigator.userAgent.indexOf(' OPR/') >= 0;

// Firefox 1.0+ (tested on Firefox 45 - 53)
var isFirefox = typeof InstallTrigger !== 'undefined';

// Internet Explorer 6-11
//   Untested on IE (of course). Here because it shows some logic for isEdge.
var isIE = /*@cc_on!@*/false || !!document.documentMode;

// Edge 20+ (tested on Edge 38.14393.0.0)
var isEdge = !isIE && !!window.StyleMedia;

// Chrome 1+ (tested on Chrome 55.0.2883.87)
// This does not work in an extension:
//var isChrome = !!window.chrome && !!window.chrome.webstore;
// The other browsers are trying to be more like Chrome, so picking
// capabilities which are in Chrome, but not in others is a moving
// target.  Just default to Chrome if none of the others is detected.
var isChrome = !isOpera && !isFirefox && !isIE && !isEdge;

// Blink engine detection (tested on Chrome 55.0.2883.87 and Opera 42.0)
var isBlink = (isChrome || isOpera) && !!window.CSS;

/* The above code is based on code from: https://stackoverflow.com/a/9851769/3773011 */    
//Verification:
var log = console.log;
if(isEdge) log = alert; //Edge console.log() does not work, but alert() does.
log('isChrome: ' + isChrome);
log('isEdge: ' + isEdge);
log('isFirefox: ' + isFirefox);
log('isIE: ' + isIE);
log('isOpera: ' + isOpera);
log('isBlink: ' + isBlink);


  1. Different implementations of an API which interfaces with something as complex and diverse as the different browsers will always end up with, at least, subtle differences between implementations. Currently, many of the differences are not that subtle.
  2. Mozilla has explicitly stated that they intend to implement functionality for WebExtensions which is not currently available in other browsers by extending the chrome.*/browser.* APIs. One way that this is being done is that there is a mechanism called WebExtensions Experiments which is intended for non-Mozilla developers to implement additional functionality for WebExtensions. The intent is that such functionality, if approved, will be migrated into stock Firefox builds.

这篇关于如何确定您的扩展后台脚本在哪个浏览器中执行?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆