Maneira segura baseada em recursos para detectar o Google Chrome com Javascript?

Question

Como o título indica, eu estaria interessado em encontrar uma maneira segura baseada em recursos (ou seja, sem usar navigator.appName ou navigator.appVersion) para detectar o Google Chrome.

Por baseado em recursos quero dizer, por exemplo:

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

Editar: Como foi apontado, a pergunta não faz muito sentido (obviamente se você quiser implementar um recurso, você testa, se quiser detectar um navegador específico, você verifica o agente do usuário), desculpe, são 5 da manhã ;) Deixe-me expressar assim:Existem objetos e/ou recursos javascript exclusivos do Chrome...

Answer 1

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

Answer 2

_{Esta resposta está muito desatualizada, mas era muito relevante naquela época, na idade da pedra.}

Acho que a detecção de recursos é mais útil do que a análise navigator.userAgent, pois pesquisei a ambigüidade do Opera no Google aqui.Ninguém pode saber se o IE16 analisará o /MSIE 16.0;/ regexp - mas podemos ter certeza de que haverá suporte para document.all.Na vida real, os recursos geralmente são sinônimos de navegadores, como: "Sem XMLHttpRequest?É o f...d IE6!"Nenhum navegador não-IE suporta document.all, mas alguns navegadores como o Maxthon podem embaralhar o userAgent.(É claro que o script pode definir document.all no Firefox por algum motivo, mas é facilmente controlável.) Portanto, sugiro esta solução.

Editar Aqui Encontrei recursos completos.

Editar 2 Eu testei que document.all também é compatível com 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
}

Usar é simples:

if(is.ie6) { ... }

Answer 3

Não é exatamente uma resposta para a pergunta...mas se você estiver tentando detectar uma marca específica de navegador, o objetivo da verificação de recursos será meio perdido.Duvido muito que qualquer outro navegador esteja usando a string userAgent do Chrome, então se sua pergunta for 'este navegador é o Chrome', você deve apenas dar uma olhada nisso.(A propósito, window.ActiveXObject não garante IE, existem plug-ins para outros navegadores que fornecem este objeto.O que ilustra o que eu estava tentando enfatizar.)

Answer 4

Para todos os padrões nazistas...às vezes você pode querer usar "tecnologias padrão" que ainda não são padrão, mas serão ...Como recursos CSS3.

Qual é a razão pela qual encontrei esta página.

Por alguma razão, o Safari executa uma combinação de border-radius com box-shadow perfeitamente, mas o Chrome não renderiza a combinação corretamente.Portanto, seria bom encontrar uma maneira de detectar o Chrome, mesmo que seja um webkit para desabilitar a combinação.

Encontrei centenas de motivos para detectar um navegador/versão específico, o que geralmente acaba descartando uma ideia de um recurso interessante, porque o que eu quero fazer não é suportado pelo grande mal...

Mas às vezes, alguns recursos são legais demais para não serem usados, mesmo que ainda não estejam padronizados.

Answer 5

Então, se você aceitar o argumento de Marijn e são interessado em testar a string do agente do usuário via javascript:

var is_chrome = navigator.userAgent.toLowerCase().indexOf('chrome') > -1;

(Crédito para: http://davidwalsh.name/detecting-google-chrome-javascript )

---

Aqui está uma análise/detalhamento muito bom da string do agente do usuário do Chromes: http://www.simonwhatley.co.uk/whats-in-google-chromes-user-agent-string

Answer 6

Costumo usar detecção de comportamento/capacidade.Verifique diretamente se o navegador oferece suporte à funcionalidade antes de contorná-lo, em vez de contorná-lo com base no que pode ser o nome do navegador (agente do usuário).

Um problema com soluções alternativas específicas do navegador é que você não sabe se o bug foi corrigido ou se o recurso é compatível agora.Ao fazer detecção de capacidade, você saber o navegador oferece ou não suporte direto, e você não está apenas sendo um navegador.

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

Answer 7

Você não deveria detectar o Chrome especificamente.Na verdade, você deve detectar o WebKit, já que no que diz respeito à renderização da página, o Chrome deve se comportar exatamente como outros navegadores WebKit (Safari, Epiphany).

Se você precisa não apenas detectar o WebKit, mas também descobrir exatamente qual versão está sendo usada, veja este link: http://trac.webkit.org/wiki/DetectingWebKit

Mas, novamente, como outras pessoas disseram acima, você não deveria detectar navegadores, você deveria detectar recursos.Veja este artigo da ADC para saber mais sobre isso: http://developer.apple.com/internet/webcontent/objectdetection.html

Answer 8

Um dos motivos pelos quais você pode precisar saber se o navegador é o Chrome é porque ele “é” muito compatível com os padrões.Já tive problemas com códigos JavaScript antigos que considerei compatíveis com os padrões (pelos padrões FF ou Opera - que são muito bons), mas o Chrome era ainda mais exigente.Isso me forçou a reescrever alguns códigos, mas às vezes pode ser mais fácil usar o truque if(isChrome) { blah...blah ) para executá-lo.O Chrome parece funcionar muito bem (sou a favor da conformidade com os padrões), mas às vezes você só precisa saber o que o usuário está executando em detalhes.

Além disso, o Chrome é muito rápido.O problema é que alguns códigos JavaScript dependem involuntariamente da lentidão de outros navegadores para funcionar corretamente, ou seja:carregamento de página, carregamento de iframe, posicionamento de links de folha de estilo e links javascript no cabeçalho da página, etc.Isso pode causar novos problemas quando as funções estão realmente disponíveis para interagir com os elementos da página.Então, por enquanto, você realmente precisa saber...

Answer 9

Eu uso esse código para criar marcadores para cada navegador (ou exibir uma mensagem para o webkit)

if (window.sidebar) { 
// Mozilla Firefox Bookmark
window.sidebar.addPanel(title, url,"");
} else if( window.external ) { // IE Favorite
  if(window.ActiveXObject) {
  //ie
  window.external.AddFavorite( url, title);
  } else {
  //chrome
  alert('Press ctrl+D to bookmark (Command+D for macs) after you click Ok');
  }
} else if(window.opera && window.print) { 
// Opera
  return true; }
 else { //safri
 alert('Press ctrl+D to bookmark (Command+D for macs) after you click Ok'); }

Answer 10

Pode haver falsos positivos, uma vez que a ópera também tem window.chrome objeto.Como uma boa solução que uso;

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

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

Esta solução quase sempre funciona.No entanto, uma coisa que descobri é que, isChrome retorna false no iPad Chrome versão 52.0 como window.chrome retorna false.

Answer 11

éIE:!!(!window.addEventListener && window.ActiveXObject),

éIE6:typeof document.createElement('DIV').style.maxHeight == "indefinido",

éIE7:!!(!window.addEventListener && window.XMLHttpRequest && !document.querySelectorAll),

éIE8:!!(!window.addEventListener && document.querySelectorAll && document.documentMode == 8),

éGecko:navigator.product == 'Gecko',

éÓpera:!!janela.opera,

éChrome:!!janela.chrome,

éWebkit:!!(!window.opera && !navigator.taintEnable && document.evaluate && navigator.product != 'Gecko'),