web-dev-qa-db-ja.com

JavaScript:ユーザーのブラウザがChromeかどうかを調べる方法は?

ブラウザが Chrome かどうかを確認するには、ブール値を返す関数が必要です。

そのような機能をどのように作成しますか?

193
Rella

更新:これを処理するための更新された方法については Jonathan's answer をご覧ください。以下の答えはまだうまくいくかもしれませんが、それはおそらく他のブラウザでいくつかの誤検知を引き起こす可能性があります

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

ただし、前述のように、ユーザーエージェントはなりすましが可能であるため、他の回答で言及されているように、これらの問題を処理するときには常に機能検出(たとえば Modernizer )を使用するのが最善です。

188
Rion Williams

さらに短くする:var is_chrome = /chrome/i.test( navigator.userAgent );

21

もっと簡単な解決策はただ使うことです:

var isChrome = !!window.chrome;

!!は単にオブジェクトをブール値に変換します。 Chrome以外のブラウザでは、このプロパティはundefinedになりますが、これは真実ではありません。

13
Drew Noakes
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, '  '));
13
Josef Ježek
var is_chrome = /chrome/.test( navigator.userAgent.toLowerCase() );
8
naveen

特定のバージョンのChromeも必要になる場合があります。

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

私の中で彼の答えを使ってくれたThe Big Lebowskiへの謝罪。

2
MrOodles

あなたが使用することができます:

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

それはv.71に取り組んでいます

2
magg89

Mac上のChromeで私のために働きます。上記よりも単純であるか、単純であるか、または信頼性があるように思われる(userAgent文字列がテストされた場合)。

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

ユーザーはユーザーエージェントを変更できます。 webkit要素のstyleオブジェクト内の接頭辞bodyプロパティをテストしてみてください

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

これをチェックしてください。 Safari、Chrome、IE、Firefox、Operaブラウザを検出するにはどうすればいいですか?

あなたの場合:var isChrome = !! window.chrome &&(!! window.chrome.webstore || !! window.chrome.runtime);

0
cedenoaugusto

さまざまなデスクトップブラウザ(Firefox、IE、Opera、Edge、Chrome)の名前を知る。 Safariを除く.

function getBrowserName() {
  var browserName = '';
  var userAgent = navigator.userAgent;
  (typeof InstallTrigger !== 'undefined') && (browserName = 'Firefox');
  ( /* @[email protected]*/ 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に関して、私はそれらが何をするのか説明することができません。

私が書いている パッケージにこの機能を追加するつもりです

0
iamdevlinph