JavaScript: как узнать, является ли браузер пользователя Chrome?

Ответ 1

Обновление: см. ответ Джонатана за обновленный способ справиться с этим. Ответ ниже может по-прежнему работать, но он может вызвать некоторые ложные срабатывания в других браузерах.

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

Однако, как упоминалось, пользовательские агенты могут быть подделаны, поэтому всегда лучше использовать функцию обнаружения (например, Модернизатор) при работе с этими проблемами, как упоминают другие ответы.

Ответ 2

Чтобы проверить, поддерживает ли браузер 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, чтобы проверить IE на window.chrome. IE, используемый для возврата undefined, теперь возвращает true. Но угадайте, что, IE11 теперь снова возвращает undefined. IE11 также возвращает пустую строку "" для window.navigator.vendor.

Надеюсь, это поможет!

UPDATE:

Благодарим Halcyon991 за то, что новая Opera 18+ также выводит значение true для window.chrome. Похоже, Opera 18 основан на Chromium 31. Поэтому я добавил проверку, чтобы убедиться, что window.navigator.vendor: "Google Inc", а не "Opera Software ASA". Также благодаря Ring и Adrien Be для хедз-ап о том, что Chrome 33 больше не возвращается.. window.chrome теперь проверяет, не имеет ли значение null. Но обратите пристальное внимание на IE11, я добавил проверку на undefined, так как IE11 теперь выводит undefined, как это было при первом выпуске. Затем после того, как некоторые сборки обновления выведены на true.. теперь последняя сборка обновлений снова выводя undefined. Microsoft не может решить это!

ОБНОВЛЕНИЕ 7/24/2015 - дополнение для проверки Opera

Opera 30 была только что выпущена. Он больше не выводит window.opera. А также window.chrome выводит значение true в новую Opera 30. Поэтому вы должны проверить, есть ли OPR в userAgent. Я обновил мое условие выше, чтобы учесть это новое изменение в Opera 30, поскольку оно использует тот же механизм рендеринга, что и Google Chrome.

ОБНОВЛЕНИЕ 10/13/2015 - дополнение для проверки IE

Добавлена ​​проверка для IE Edge из-за ее вывода true для window.chrome.. хотя IE11 выводит undefined для window.chrome. Спасибо artfulhacker за то, что сообщили нам об этом!

ОБНОВЛЕНИЕ 2/5/2016 - дополнение для проверки Chrome iOS

Добавлена ​​проверка проверки iOS Chrome CriOS из-за вывода true для Chrome на iOS. Спасибо xinthose за то, что сообщили нам об этом!

ОБНОВЛЕНИЕ 4/18/2018 - изменение для проверки Opera

Отредактированная проверка Opera, проверка window.opr не undefined, так как теперь Chrome 66 имеет OPR в window.navigator.vendor. Спасибо Frosty Z и Даниэль Уолман за сообщение об этом!

Ответ 3

еще короче: var is_chrome = /chrome/i.test( navigator.userAgent );

Ответ 4

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, '  '));

Ответ 5

Более простое решение состоит в том, чтобы использовать:

var isChrome = !!window.chrome;

!! просто преобразует объект в логическое значение. В браузерах, отличных от Chrome, это свойство будет undefined, что не является правдой.

Ответ 6

var is_chrome = /chrome/.test( navigator.userAgent.toLowerCase() );

Ответ 7

Вам также может понадобиться конкретная версия Chrome:

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

Извинился перед Большим Лебовским за использование своего ответа в моей.

Ответ 8

Пользователь может изменить пользовательский агент. Попробуйте протестировать свойство webkit prefixed в объекте style элемента body

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

Ответ 9

Ты можешь использовать:

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

Он работает над v.71

Ответ 10

все ответы неверны. "Opera" и "Chrome" одинаковы во всех случаях.

(отредактированная часть)

вот правильный ответ

if (window.chrome && window.chrome.webstore) {
    // this is Chrome
}