使用特征检测的安全方法来检测Google Chrome浏览器的Javascript?

16

如标题所述,我希望找到一种安全的基于特征的(即不使用navigator.appName或navigator.appVersion)方法来检测Google Chrome。

这里的特征指的是,例如:

if(window.ActiveXObject) {
    // internet explorer!
}

编辑:正如被指出的那样,该问题没有太多意义(如果你想实现一个功能,你会测试它,如果你想检测特定的浏览器,你会检查用户代理),很抱歉,现在是凌晨5点;)让我这样表达:是否有任何仅适用于Chrome的javascript对象和/或功能...


1
为什么?如果您按功能进行检查,那么浏览器并不重要,重要的是它支持哪些功能。 - SCdF
就像我说的,我问这个问题主要是出于好奇心...我认为我过分强调了“安全”这一部分 :) ,另一个提问的方式是:有没有任何Chrome独有的Javascript对象或特性? - jeannicolas
正如其他人指出的那样,Chrome 应该大多符合标准。由于它基于 WebKit,所以它的 HTML、CSS 和 JavaScript 功能应该与已经存在于苹果 Safari 中的功能相匹配。 - TobiX
1
+1 特性检测:http://peter.michaux.ca/articles/feature-detection-state-of-the-art-browser-scripting - gblazex
-1 表示用户代理字符串。 - gblazex
显示剩余2条评论
11个回答

33
isChrome = function() {
    return Boolean(window.chrome);
}

1
你能否给我展示一个例子,比如如果用户的浏览器是Chrome,就弹出“欢迎使用Chrome!”的提示? - Web_Designer
1
我刚刚验证了上面的isChrome函数,即使是最新版本也可以正常工作。(在Chrome中打开JS控制台。键入“Boolean(window.chrome)”。您应该会看到“true”。在其他浏览器中尝试,您应该会看到“false”。) - pcorcoran
这可能看起来与主题无关,但你让我眼界大开。我不知道你可以在那里写入控制台。这可能非常明显,但我从未意识到。谢谢! - Blaine Hatab
1
@VoidKing Opera现在有一个window.chrome对象,你将会得到假阳性。 - user60456
2
@Joe Opera 27.0.1698.89115(至少Android版本)似乎未发布对象“window.chrome”。 @xdumaine 在Android平台的Chrome中不存在“window.chrome.webstore”对象。 - lucasvc
显示剩余3条评论

11

这个回答已经非常过时了,不过在很久以前是非常相关的。

我认为特性检测比navigator.userAgent解析更有用,因为我在这里搜索了Opera歧义here。没有人知道IE16是否会解析/MSIE 16.0; /正则表达式,但我们可以相当确定,document.all支持将存在。在现实生活中,功能通常是浏览器的同义词,例如:"没有XMLHttpRequest?那就是该死的IE6!" 没有非IE浏览器支持document.all,但是一些浏览器(如Maxthon)可以混淆userAgent。(当然,脚本可以出于某种原因在Firefox中定义document.all,但这很容易控制。)因此,我建议使用此解决方案。

编辑这里我找到了完整的资源。

编辑2我测试了document.all也受Opera支持!

var is = {
  ff: window.globalStorage,
  ie: document.all && !window.opera,
  ie6: !window.XMLHttpRequest,
  ie7: document.all && window.XMLHttpRequest && !XDomainRequest && !window.opera,
  ie8: document.documentMode==8,
  opera: Boolean(window.opera),
  chrome: Boolean(window.chrome),
  safari: window.getComputedStyle && !window.globalStorage && !window.opera
}

使用很简单:

if(is.ie6) { ... }

4
就好像在说:“你有金发和白牙齿吗?那你一定是布拉德·皮特…” - gblazex
1
你说的OMG不是很明白?这正是特性检测的关键所在。 - Justin Johnson
1
这个答案已经过时了。在Edge上,当我使用console.log打印这个答案时,我得到的是“Chrome”,而在Firefox上我得到的是“Safari”。 - Ryan Walker
@RyanWalker 这绝对是事实,正如第一行所警告的那样。但问题至今仍然存在,因为微软的开发工作毫无连贯性可言。没人知道Edge会不会在某一天变成Sledge。 - Jan Turoň
哈哈,现在Chrome和Edge都是基于Chromium构建的,并且两者都在window对象中具有chrome属性,这意味着Chrome === Edge。 - Yanjan. Kaf.

4

这并不是对问题的直接回答……但如果你试图检测特定的浏览器品牌,那么进行特性检测就没有意义了。我非常怀疑其他浏览器会使用Chrome的userAgent字符串,因此如果你想知道“这个浏览器是不是Chrome”,你应该只看这个。另外,window.ActiveXObject并不能保证是IE,因为其他浏览器也有提供此对象的插件。这也说明了我试图表达的观点。


你完全正确! :) 我想我应该问的是: 有没有任何JS对象是特定于Chrome的...只是出于好奇而已... - jeannicolas

4
对于所有的标准控制者...有时候你可能想使用还不是标准但将来会成为标准的"标准技术",比如CSS3特性。
这就是我找到这个页面的原因。
出于某种原因,Safari可以很好地运行border-radius和box-shadow的组合,但Chrome无法正确渲染这种组合。因此,找到一种方法来检测Chrome即使它是Webkit也可以禁用这种组合,这将非常好。
我已经遇到了数百个检测特定浏览器/版本的原因,通常最终放弃一个很酷的功能的想法,因为我想做的并没有得到大恶魔的支持......
但有时,一些功能太酷了,不能不使用它们,即使它们还没有标准化。

1

我经常使用行为/能力检测。在绕过它之前,直接检查浏览器是否支持功能,而不是根据可能是浏览器名称(用户代理)来绕过它。

浏览器特定的解决方法的问题在于,您不知道错误是否已修复或功能现在是否受支持。当您进行能力检测时,您知道浏览器是否直接支持它,而且您不仅仅是针对浏览器。

http://diveintohtml5.ep.io/everything.html


1

0

可能会出现误报,因为Opera也有window.chrome对象。作为一个好的解决方案,我使用以下代码:

var isOpera = !!window.opera || !!window.opr;// Opera 8.0+

var isChrome = !!window.chrome && !isOpera;

这个解决方案几乎总是有效的。 然而,我发现一件事情,就是在iPad Chrome版本52.0中,isChrome返回false,因为window.chrome也返回false


在新的(基于Chromium的)Edge浏览器上,!!window.chrometrue - OdkoPP

0

你不应该专门检测Chrome。如果需要的话,你应该检测WebKit,因为就页面渲染而言,Chrome应该与其他WebKit浏览器(如Safari、Epiphany)的行为完全相同。

如果你不仅需要检测WebKit,还要找出具体使用的版本,请参阅此链接:http://trac.webkit.org/wiki/DetectingWebKit

但是,正如其他人在上面所说的那样,你不应该检测浏览器,而应该检测功能。有关更多信息,请参阅此ADC文章:http://developer.apple.com/internet/webcontent/objectdetection.html


0

你需要知道浏览器是Chrome的一个原因是它非常符合标准。我已经遇到了一些旧的JavaScript代码问题,我认为它们符合标准(按照FF或Opera标准 - 这些标准相当不错),但Chrome更加挑剔。这迫使我重写一些代码,但有时使用if(isChrome){blah ... blah)技巧可能更容易让它运行。Chrome似乎工作得非常好(我支持标准合规性),但有时您只需要详细了解用户正在运行什么。

此外,Chrome非常快。问题是,某些JavaScript代码无意中依赖于其他浏览器的缓慢性能才能正常工作,例如:页面加载、iframe加载、样式表链接和页面头部的javascript链接的位置等。这些可能会导致新的问题,例如何时函数真正可用以与页面元素交互。因此,现在您确实需要知道...


Opera和Safari比Chrome具有更好的标准JS支持。请参见:http://sputnik.googlelabs.com/ - Savageman

0

我使用这段代码为每个浏览器创建书签(或在Webkit中显示消息)

if (window.sidebar) { 
// Mozilla Firefox 书签
window.sidebar.addPanel(title, url,"");
} else if( window.external ) { // IE 收藏夹
  if(window.ActiveXObject) {
  //ie
  window.external.AddFavorite( url, title);
  } else {
  //chrome
  alert('点击确定后,请按Ctrl+D添加书签(Mac用户请按Command+D)');
  }
} else if(window.opera && window.print) { 
// Opera
  return true; }
 else { //safri
 alert('点击确定后,请按Ctrl+D添加书签(Mac用户请按Command+D)'); }


网页内容由stack overflow 提供, 点击上面的
可以查看英文原文,
原文链接