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


Мне нужна функция, возвращающая логическое значение, чтобы проверить, если браузер Chrome.

Как создать такую функциональность?

9 162

9 ответов:

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

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

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

чтобы проверить, если браузер 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.

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

обновление:

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

обновление 24.07.2015-дополнение для проверки Opera

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

обновление 10/13/2015-дополнение для проверки IE

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

обновление 2/5/2016-дополнение для iOS Chrome check

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

обновление 18.04.2018-изменение для проверки Opera

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

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

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

гораздо более простое решение-просто использовать:

var isChrome = !!window.chrome;

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

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

вы также можете использовать конкретную версию Chrome:

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

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

пользователь может изменить агента пользователя . Попробуйте проверить для webkit свойство с префиксом в

все ответы неверны. "Опера" и "хром" одинаковы во всех случаях.

(исправленная часть)

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

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