JavaScript:如何确定用户浏览器是否为Chrome?

2020/10/12 10:41 · javascript ·  · 0评论

我需要一些返回布尔值的函数来检查浏览器是否为Chrome

如何创建此类功能?

更新:请参阅乔纳森的答案以获取更新的方式来处理此问题。以下答案可能仍然有效,但是可能会在其他浏览器中引发误报。

var isChrome = /Chrome/.test(navigator.userAgent) && /Google Inc/.test(navigator.vendor);

但是,如前所述,用户代理可以被欺骗,因此在处理这些问题时总是最好使用功能检测(例如Modernizer),如其他答案所述。

要检查浏览器是否为Google Chrome浏览器,请尝试以下操作:

// please note, 
// that IE11 now returns undefined again for window.chrome
// and new Opera 30 outputs true for window.chrome
// but needs to check if window.opr is not undefined
// and new IE Edge outputs to true now for window.chrome
// and if not iOS Chrome check
// so use the below updated condition
var isChromium = window.chrome;
var winNav = window.navigator;
var vendorName = winNav.vendor;
var isOpera = typeof window.opr !== "undefined";
var isIEedge = winNav.userAgent.indexOf("Edge") > -1;
var isIOSChrome = winNav.userAgent.match("CriOS");

if (isIOSChrome) {
   // is Google Chrome on IOS
} else if(
  isChromium !== null &&
  typeof isChromium !== "undefined" &&
  vendorName === "Google Inc." &&
  isOpera === false &&
  isIEedge === false
) {
   // is Google Chrome
} else { 
   // not Google Chrome 
}

使用示例:http : //codepen.io/jonathan/pen/WpQELR

之所以有效,是因为如果您使用Google Chrome浏览器检查器并转到控制台标签。输入“窗口”,然后按Enter。然后,您可以查看“窗口对象”的DOM属性。折叠对象时,您可以查看所有属性,包括'chrome'属性。

您不能再使用true等于true来检查IE中的window.chromeIE曾经返回undefined,现在返回true但是猜猜是什么,IE11现在再次返回undefined。IE11还返回一个空字符串""window.navigator.vendor

我希望这有帮助!

更新:

感谢Halcyon991在下面指出,新的Opera 18+也会输出true window.chrome看起来Opera 18是基于Chromium 31的因此,我添加了一个检查以确保window.navigator.vendoris是,"Google Inc"而不是is "Opera Software ASA"同时还要感谢RingAdrien Be提醒,Chrome 33不再返回true ...window.chrome现在检查是否不为null。但是请密切注意IE11,undefined因为IE11现在已经输出了undefined,所以我增加了检查,就像第一次发布时一样。然后经过一些更新版本将其输出到true..现在undefined再次输出最近的更新版本微软无法下定决心!

更新7/24/ 2015-添加Opera检查

Opera 30刚刚发布。它不再输出window.opera并且window.chrome在新的Opera 30中输出为true。因此,您必须检查OPR是否在userAgent中我更新了上述条件,以说明Opera 30中的这一新更改,因为它使用的渲染引擎与Google Chrome相同。

更新10/13/ 2015-IE检查的补充

增加了检查IE边缘,由于其输出truewindow.chrome..即使IE11输出undefinedwindow.chrome感谢artfulhacker让我们知道这一点!

更新2/5/ 2016-iOS Chrome检查的补充

添加了针对iOS的Chrome浏览器支票,CriOS原因是它true在iOS上输出了Chrome浏览器。感谢xinthose让我们知道这一点!

更新4/ 18/2018-Opera检查更改

编辑检查歌剧,检查window.opr是不是undefined因为现在的Chrome 66OPRwindow.navigator.vendor感谢Frosty ZDaniel Wallman的报道!

甚至更短: var is_chrome = /chrome/i.test( navigator.userAgent );

如果要检测Chrome的呈现引擎(而不是Google Chrome或Chromium中的特定功能),则一个简单的选项是:

var isChrome = !!window.chrome;

注意:true对于基于Chrome的Edge,Opera等的许多版本,这也将返回(感谢@Carrm指出这一点)。避免那是一场持续的战斗(请参阅window.opr下文),因此您应该问自己是否要检测渲染引擎(2020年几乎所有主流现代浏览器都使用过)或某些其他Chrome(或Chromium?)特定功能。

你也许可以跳过!!

console.log(JSON.stringify({
  isAndroid: /Android/.test(navigator.userAgent),
  isCordova: !!window.cordova,
  isEdge: /Edge/.test(navigator.userAgent),
  isFirefox: /Firefox/.test(navigator.userAgent),
  isChrome: /Google Inc/.test(navigator.vendor),
  isChromeIOS: /CriOS/.test(navigator.userAgent),
  isChromiumBased: !!window.chrome && !/Edge/.test(navigator.userAgent),
  isIE: /Trident/.test(navigator.userAgent),
  isIOS: /(iPhone|iPad|iPod)/.test(navigator.platform),
  isOpera: /OPR/.test(navigator.userAgent),
  isSafari: /Safari/.test(navigator.userAgent) && !/Chrome/.test(navigator.userAgent),
  isTouchScreen: ('ontouchstart' in window) || window.DocumentTouch && document instanceof DocumentTouch,
  isWebComponentsSupported: 'registerElement' in document && 'import' in document.createElement('link') && 'content' in document.createElement('template')
}, null, '  '));
var is_chrome = /chrome/.test( navigator.userAgent.toLowerCase() );

如果您感觉很勇敢,可以尝试浏览器嗅探并获得一个版本:

var ua = navigator.userAgent;
if(/chrome/i.test(ua)) {
    var uaArray = ua.split(' ')
    ,   version = uaArray[uaArray.length - 2].substr(7);
}

检测到的版本可能是Chrome版本,Edge版本或其他版本。浏览器插件可以轻松更改userAgent,平台和其他内容,因此不建议这样做。

向The Big Lebowski致歉,感谢他在我的内部使用他的答案。

您可以使用:

navigator.userAgent.indexOf("Chrome") != -1

正在处理v.71

在Mac上的Chrome上对我有效。似乎比以上所有或更简单或更可靠(如果测试了userAgent字符串)。

        var isChrome = false;
        if (window.chrome && !window.opr){
            isChrome = true;
        }
        console.log(isChrome);

用户可以更改用户代理。尝试测试元素对象中的webkit前缀属性stylebody

if ("webkitAppearance" in document.body.style) {
  // do stuff
}

了解不同桌面浏览器(Firefox,IE,Opera,Edge,Chrome)的名称。Safari除外。

function getBrowserName() {
  var browserName = '';
  var userAgent = navigator.userAgent;
  (typeof InstallTrigger !== 'undefined') && (browserName = 'Firefox');
  ( /* @cc_on!@*/ false || !!document.documentMode) && (browserName = 'IE');
  (!!window.chrome && userAgent.match(/OPR/)) && (browserName = 'Opera');
  (!!window.chrome && userAgent.match(/Edge/)) && (browserName = 'Edge');
  (!!window.chrome && !userAgent.match(/(OPR|Edge)/)) && (browserName = 'Chrome');

  /**
   * Expected returns
   * Firefox, Opera, Edge, Chrome
   */
  return browserName;
}

在以下浏览器版本中工作:

Opera - 58.0.3135.79
Firefox - 65.0.2 (64-bit)
IE - 11.413.15063 (JS Fiddle no longer supports IE just paste in Console)
Edge - 44.17763.1.0
Chrome - 72.0.3626.121 (Official Build) (64-bit)

查看要点这里和小提琴这里

原始代码段不再适用于Chrome浏览器,我忘记了在哪里找到它。它以前有野生动物园,但我再也无法使用野生动物园了,所以我无法验证了。

只有Firefox和IE代码是原始代码段的一部分。

对Opera,Edge和Chrome的检查非常简单。它们在userAgent中具有差异。OPR仅存在于Opera中。Edge仅存在于Edge中。因此,要检查Chrome是否应使用这些字符串。

至于Firefox和IE,我无法解释它们的作用。

我将这个功能添加到我正在编写程序包中

检查此:如何检测Safari,Chrome,IE,Firefox和Opera浏览器?

在您的情况下:

var isChrome = (window.chrome.webstore || window.chrome.runtime) && !!window.chrome;

所有答案都是错误的。在所有情况下,“ Opera”和“ Chrome”都是相同的。

(编辑部分)

这是正确的答案

if (window.chrome && window.chrome.webstore) {
    // this is Chrome
}
本文地址:http://javascript.askforanswer.com/javascriptruhequedingyonghuliulanqishifouweichrome.html
文章标签: ,   ,   ,  
版权声明:本文为原创文章,版权归 javascript 所有,欢迎分享本文,转载请保留出处!

文件下载

老薛主机终身7折优惠码boke112

上一篇:
下一篇:

评论已关闭!