Ich benötige eine Funktion, die einen booleschen Wert zurückgibt, um zu überprüfen, ob der Browser Chrome ist .
Wie erstelle ich solche Funktionen?
Ich benötige eine Funktion, die einen booleschen Wert zurückgibt, um zu überprüfen, ob der Browser Chrome ist .
Wie erstelle ich solche Funktionen?
Antworten:
Update: In Jonathans Antwort finden Sie eine aktualisierte Vorgehensweise. Die folgende Antwort funktioniert möglicherweise immer noch, kann jedoch in anderen Browsern zu Fehlalarmen führen.
var isChrome = /Chrome/.test(navigator.userAgent) && /Google Inc/.test(navigator.vendor);
Wie bereits erwähnt, können User Agents gefälscht werden. Daher ist es immer am besten, bei der Behandlung dieser Probleme die Feature-Erkennung (z. B. Modernizer ) zu verwenden, wie in anderen Antworten erwähnt.
var is_chrome = ((navigator.userAgent.toLowerCase().indexOf('chrome') > -1) &&(navigator.vendor.toLowerCase().indexOf("google") > -1));
Google Inc
zu zurück navigator.vendor
, daher ist diese Methode nicht kugelsicher. Etwas wie /Chrome/.test(navigator.userAgent) && /Google Inc/.test(navigator.vendor) && !/OPR/.test(navigator.userAgent)
würde wahrscheinlich besser funktionieren
Versuchen Sie Folgendes , um zu überprüfen, ob der Browser Google Chrome ist:
// 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
}
Anwendungsbeispiel: http://codepen.io/jonathan/pen/WpQELR
Der Grund dafür ist, dass Sie den Google Chrome-Inspektor verwenden und zur Registerkarte "Konsole" wechseln. Geben Sie 'window' ein und drücken Sie die Eingabetaste. Anschließend können Sie die DOM-Eigenschaften für das 'Fensterobjekt' anzeigen. Wenn Sie das Objekt reduzieren, können Sie alle Eigenschaften anzeigen, einschließlich der Eigenschaft 'chrome'.
Sie können nicht mehr streng gleich true verwenden, um im IE nachzuschauen window.chrome
. Früher kehrte der IE zurück undefined
, jetzt kehrt er zurück true
. Aber raten Sie mal, IE11 gibt jetzt wieder undefiniert zurück. IE11 gibt auch eine leere Zeichenfolge ""
für zurück window.navigator.vendor
.
Ich hoffe das hilft!
AKTUALISIEREN:
Vielen Dank an Halcyon991 für den Hinweis, dass die neue Opera 18+ auch für true ausgegeben wirdwindow.chrome
. Es sieht so aus, als ob Opera 18 auf Chrom 31 basiert . Also habe ich einen Scheck hinzugefügt, um sicherzustellen, dass das window.navigator.vendor
ist: "Google Inc"
und nicht ist "Opera Software ASA"
. Auch danke an Ring und Adrien Be für die Hinweise, dass Chrome 33 nicht mehr wahr ist ... window.chrome
prüft jetzt, ob es nicht null ist. Aber achten Sie genau auf IE11. Ich habe die Überprüfung hinzugefügt, undefined
da IE11 jetzt ausgegeben wird undefined
, wie bei der ersten Veröffentlichung. Nach einigen Update-Builds wird es ausgegeben true
. Jetzt wird der letzte Update-Build undefined
wieder ausgegeben . Microsoft kann sich nicht entscheiden!
UPDATE 24.07.2015 - Ergänzung für Opera Check
Opera 30 wurde gerade veröffentlicht. Es wird nicht mehr ausgegeben window.opera
. Und window.chrome
gibt in der neuen Opera 30 auch true aus. Sie müssen also überprüfen, ob OPR im userAgent enthalten ist . Ich habe meinen obigen Zustand aktualisiert, um dieser neuen Änderung in Opera 30 Rechnung zu tragen, da dieselbe Render-Engine wie Google Chrome verwendet wird.
UPDATE 13.10.2015 - Ergänzung zur IE-Prüfung
Überprüfung für IE Edge hinzugefügt, da es true
für window.chrome
.. ausgibt , obwohl IE11 undefined
für ausgibt window.chrome
. Vielen Dank an artfulhacker, der uns darüber informiert hat!
UPDATE 05.02.2016 - Ergänzung für iOS Chrome Check
Prüfung für iOS Chrome-Prüfung hinzugefügt, CriOS
da sie true
für Chrome unter iOS ausgegeben wird. Vielen Dank an xinthose, dass Sie uns darüber informiert haben!
UPDATE 18.04.2008 - Änderung für Opera-Check
Bearbeitet Check für Opera, Kontrolle window.opr
ist nicht undefined
da jetzt Chrome 66 hat OPR
in window.navigator.vendor
. Vielen Dank an Frosty Z und Daniel Wallman für die Meldung!
Mozilla/5.0 (Linux; Android 8.0.0; ASUS_Z012D Build/OPR1.170623.026) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/65.0.3325.109 Mobile Safari/537.36
Daher isChrome()
kehrt falsch .
window.opr
nicht undefined
.
noch kürzer: var is_chrome = /chrome/i.test( navigator.userAgent );
true
in Microsoft Edge.
Eine viel einfachere Lösung ist nur zu verwenden:
var isChrome = !!window.chrome;
Das !!
konvertiert das Objekt einfach in einen booleschen Wert. In Nicht-Chrome-Browsern ist diese Eigenschaft undefined
nicht wahr.
Beachten Sie, dass dies auch für Versionen von Edge zurückgegeben wird, die auf Chrome basieren (danke @Carrm für den Hinweis).
true
zu window.chrome
. Schauen Sie sich conditionizr.com an, das über eine kugelsichere Erkennung + Korrektur verfügt.
!!
konvertiert den Wert entweder true
oder false
. typeof(window.chrome)
gibt "object"
, während typeof(!!window.chrome)
gibt "boolean"
. Ihr Codebeispiel funktioniert auch, da die if
Anweisung die Konvertierung durchführt.
true
für Edge zurück.
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 is_chrome = /chrome/.test( navigator.userAgent.toLowerCase() );
true
in Microsoft Edge zurück.
Möglicherweise möchten Sie auch die spezifische Version von Chrome:
var ua = navigator.userAgent;
if(/chrome/i.test(ua)) {
var uaArray = ua.split(' ')
, version = uaArray[uaArray.length - 2].substr(7);
}
Entschuldigung an The Big Lebowski für die Verwendung seiner Antwort in meiner.
"537.36"
in Microsoft Edge.
Sie können verwenden:
navigator.userAgent.indexOf("Chrome") != -1
Es arbeitet an v.71
navigator.userAgent.includes("Chrome")
Funktioniert für mich auf Chrome auf Mac. Scheint einfacher oder zuverlässiger zu sein (falls die userAgent-Zeichenfolge getestet wurde) als alle oben genannten.
var isChrome = false;
if (window.chrome && !window.opr){
isChrome = true;
}
console.log(isChrome);
const isChrome = window.chrome && !window.opr;
Benutzer kann Benutzeragent ändern. Versuchen Sie zum Testen webkit
vorangestelltes Eigentum in style
Objekt von body
Element
if ("webkitAppearance" in document.body.style) {
// do stuff
}
Überprüfen Sie Folgendes: Wie erkennt man den Browser Safari, Chrome, IE, Firefox und Opera?
In Ihrem Fall: var isChrome = !! window.chrome && (!! window.chrome.webstore || !! window.chrome.runtime);
Um die Namen verschiedener Desktop-Browser (Firefox, IE, Opera, Edge, Chrome) zu kennen. Außer Safari.
function getBrowserName() {
var browserName = '';
var userAgent = navigator.userAgent;
(typeof InstallTrigger !== 'undefined') && (browserName = 'Firefox');
( /* @cc_on!@*/ 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;
}
Funktioniert in folgenden Browserversionen:
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)
Sehen Sie sich hier das Wesentliche und hier die Geige an
Das ursprüngliche Code-Snippet funktionierte nicht mehr für Chrome und ich habe vergessen, wo ich es gefunden habe. Es hatte vorher eine Safari, aber ich habe keinen Zugang mehr zur Safari, daher kann ich mich nicht mehr verifizieren.
Nur die Firefox- und IE-Codes waren Teil des ursprünglichen Snippets.
Die Überprüfung auf Opera, Edge und Chrome ist unkompliziert. Sie haben Unterschiede im userAgent. OPR
existiert nur in Opera. Edge
existiert nur in Edge. Um nach Chrome zu suchen, sollte diese Zeichenfolge nicht vorhanden sein.
Was Firefox und IE betrifft, kann ich nicht erklären, was sie tun.
Ich werde diese Funktionalität einem Paket hinzufügen, das ich schreibe
Alle Antworten sind falsch. "Opera" und "Chrome" sind in allen Fällen gleich.
(bearbeiteter Teil)
Hier ist die richtige Antwort
if (window.chrome && window.chrome.webstore) {
// this is Chrome
}
window.chrome.webstore
jetztundefined