확장 배경 스크립트가 실행중인 브라우저를 결정하는 방법은 무엇입니까? 배경 스크립트에서

Question

내가 크롬 확장, 파이어 폭스 WebExtensions, 에지 확장에 대해서 이야기하고

...

아닌 콘텐츠 스크립트, 내가 사용하고있는 브라우저 알아야 할 명확한 방법이있다? 다른 브라우저에서 다른 작업을 수행해야합니다.

예, navigator.userAgent이 유용 할 수 있지만 은 매우 명확하지 않습니다..

이 작업을 수행하는 데 사용할 수있는 확장 API가 있습니까? 뭔가, chrome.extension.browserType. (물론 이것은 존재하지 않습니다 ..)

Answer 1

현재 어떤 브라우저가 사용되고 있는지를 감지 할 수있는 특정 API가 없습니다. 일반적인 확장 프레임 워크를 지원하기 위해 이동하는 주요 브라우저의 이점 중 하나는 여러 브라우저를 지원하는 단일 코드베이스를 가질 수 있다는 것입니다. 적용 가능한 모든 브라우저에서 사용할 수있는 기능 집합이 늘어나고 있지만 항상 차이점이 있습니다. 이러한 차이점은 지원되는 것만이 아니며 특정 API에 대한 효과 또는 API 사용 방법에 대한 세부 사항에 따라 다를 수 있습니다. 따라서 어떤 점에서는 코드가 현재 실행중인 브라우저를 결정할 수 있어야합니다.

top-voted answer to "How to detect Safari, Chrome, IE, Firefox and Opera browser?"에서 사용할 수있는 몇 가지 좋은 코드가 있습니다. 그러나 확장 환경에서 작동하려면 약간의 수정이 필요합니다.

그 대답의 코드를 기반으로

, 다음으로 감지합니다 :

에지

파이어 폭스

오페라

Bink의 엔진

// 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); 

• 크롬을항상 구현 사이, 적어도, 미묘한 차이로 끝날 것이다 다른 브라우저처럼 복잡하고 다양한 무언가와 인터페이스하는 API의
  1. 다른 구현. 현재, 많은 차이점이 미묘하지는 않습니다.
  2. Mozilla는 다른 브라우저에서 현재 사용할 수없는 WebExtensions에 대한 기능을 구현하고자한다고 명시 적으로 명시했습니다. chrome.*/browser.* API를 확장합니다. 이것이 이루어지고있는 한 가지 방법은 WebExtensions Experiments이라는 메커니즘이 있습니다.이 메커니즘은 모질라가 아닌 개발자가 WebExtensions에 대한 추가 기능을 구현하기위한 것입니다. 의도적으로 이러한 기능이 승인되면 Firefox 빌드로 마이그레이션됩니다.