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

方法一.

要检查浏览器是否为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("Edg") > -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 
}

使用示例:https ://codepen.io/jonathan/pen/RwQXZxJ?editors=1111

之所以可行,是因为如果您使用 Google Chrome 检查器并转到控制台选项卡。输入“窗口”并按回车键。然后您就可以查看“窗口对象”的 DOM 属性。折叠对象时,您可以查看所有属性,包括“chrome”属性。

您不能再使用严格等于 true 在 IE 中检查window.chrome. IE曾经回归undefined,现在回归true但是你猜怎么着,IE11 现在再次返回 undefined。""IE11 还为返回一个空字符串window.navigator.vendor

我希望这有帮助!

更新:

感谢Halcyon991在下面指出,新的 Opera 18+ 也为window.chrome. 看起来Opera 18是基于Chromium 31的。所以我添加了一个检查以确保window.navigator.vendoris:"Google Inc"而不是 is "Opera Software ASA"。还要感谢RingAdrien Be 提醒Chrome 33 不再返回 true ...window.chrome现在检查是否为空。但是请密切注意 IE11,我添加了检查,undefined因为 IE11 现在输出undefined,就像它在第一次发布时所做的那样。然后在一些更新构建之后它输出到true..现在最近的更新构建undefined再次输出。微软拿不定主意!

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

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

更新10/13/2015 - 添加 IE 检查

添加了对 IE Edge 的检查,因为它输出true..即使window.chromeIE11 输出undefinedwindow.chrome感谢artfulhacker让我们知道这件事!

2016 年 2 月 5 日更新- 增加了 iOS Chrome 检查

添加了对 iOS Chrome 检查的检查,CriOS因为它在 iOS 上为 Chrome 输出true。感谢xinthose让我们知道这件事!

2018 年 4 月 18 日更新- Opera 检查更改

编辑了 Opera 的检查,检查window.opr不是undefined因为现在 Chrome 66OPRwindow.navigator.vendor. 感谢Frosty ZDaniel Wallman报告此事!

 

 

方法二.

更新:请参阅Jonathan 的回答以获取处理此问题的更新方法。下面的答案可能仍然有效,但它可能会在其他浏览器中触发一些误报。

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

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

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