जावास्क्रिप्ट: यह कैसे पता लगाया जाए कि उपयोगकर्ता ब्राउज़र क्रोम है?

Question

अगर ब्राउज़र है तो जाँच करने के लिए मुझे बूलियन मान लौटाने वाले कुछ फ़ंक्शन की आवश्यकता है क्रोम ।

मैं ऐसी कार्यक्षमता कैसे बनाऊं?

Comments

क्या आप सुनिश्चित हैं कि आप इसके बजाय फीचर डिटेक्शन नहीं करना चाहते हैं (पूछने के बजाय "क्या यह क्रोम है?" पूछें "क्या यह ऐसा कर सकता है जिसकी मुझे आवश्यकता है?")

— bdukes

कौन जानता है? वह चाहता है कि उपयोगकर्ता को

— नवीन

यह प्रश्न उपयोगकर्ता एजेंट का पता लगाने की समस्या को दर्शाता है। केवल तीन साल बाद, Fun 3D बॉक्स बैकग्राउंड क्रोम में मेरे लो-एंड मोबाइल फोन में लोड करने की कोशिश करेगा, लेकिन मेरे हाई-एंड डेस्कटॉप कंप्यूटर में फ़ायरफ़ॉक्स में कोशिश भी नहीं करेगा।

— अल्वारो गोंजालेज

मैं मानता हूं कि फीचर डिटेक्शन जाने का तरीका है। लेकिन ऐसे वैध क्षेत्र हैं जहाँ आप पता लगाना चाहेंगे। उदाहरण के लिए मैं केवल बंदर के लिए xhr.sendAs बंदर पैच करना चाहता हूं। अगर filereader.readasbinary कार्यान्वित किया जाता है, तो मेरा प्रारंभिक समाधान चेक किया गया। हालाँकि, मुझे कुछ समस्याएँ आ रही हैं जहाँ यह कुछ मोबाइल ब्राउज़र के लिए भी पैच करता है और इसलिए अपलोड विफल हो जाता है। मुझे यह फिक्स केवल क्रोम के लिए चाहिए।

— frostymarvelous

जानना चाहते हैं कि यदि ब्राउज़र क्रोम है तो यह जानना प्रासंगिक क्यों हो सकता है? Chrome RSS फ़ीड्स लोड करने में सक्षम नहीं होने के बारे में कैसे? ताकि RSS फ़ीड से लिंक करने के बजाय जो Chrome में लोड करने में विफल हो, आप वास्तव में एक चेतावनी प्रदान कर सकते हैं या उपयोगकर्ता को पुनर्निर्देशित कर सकते हैं? आपके लिए Google Chrome का कोई धन्यवाद नहीं ...

— Pic मिकाएल

Answer 1

अद्यतन: कृपया इसे संभालने के लिए अद्यतन तरीके के लिए जोनाथन का जवाब देखें । नीचे दिया गया उत्तर अभी भी काम कर सकता है, लेकिन यह अन्य ब्राउज़रों में कुछ गलत सकारात्मक ट्रिगर कर सकता है।

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

हालांकि, जैसा कि उल्लेख किया गया है कि उपयोगकर्ता एजेंट खराब हो सकते हैं, इसलिए इन मुद्दों को संभालते समय फीचर-डिटेक्शन (जैसे मॉर्डनाइज़र ) का उपयोग करना हमेशा सबसे अच्छा होता है , जैसा कि अन्य जवाबों में उल्लेख किया गया है।

Comments

.toLowerCase का उपयोग करने के पीछे क्या तर्क है - क्यों न केवल navigator.userAgent.indexOf ('क्रोम') मैं बहुत सारे लोगों को इसका उपयोग करते हुए देखता हूं, लेकिन इस बिंदु पर यकीन नहीं है?

— जॉन

@ शेर क्योंकि उनके पास क्रोम नहीं है। यह केवल आईओएस सफारी के आसपास की त्वचा है।

— 13

धन्यवाद, यद्यपि आपका var नाम ऊंट होना चाहिए

— दिमित्री कोपरिवा

चूँकि बहुत सारे ब्राउज़र इस पर सही साबित होते हैं, यहाँ पर मैंने जो कोड इस्तेमाल किया है उसमें एज, मैक्सथन, आईओएस सफारी ... आदि शामिल हैं var is_chrome = ((navigator.userAgent.toLowerCase().indexOf('chrome') > -1) &&(navigator.vendor.toLowerCase().indexOf("google") > -1));

— एलेक्स सी।

ओपेरा (कम से कम संस्करण 42) पर लौटता Google Incहै navigator.vendor, इसलिए यह विधि बुलेटप्रूफ नहीं है, ऐसा कुछ /Chrome/.test(navigator.userAgent) && /Google Inc/.test(navigator.vendor) && !/OPR/.test(navigator.userAgent)संभवत: बेहतर काम करेगा

— yorch

Answer 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 इंस्पेक्टर का उपयोग करते हैं और कंसोल टैब पर जाते हैं। 'विंडो' टाइप करें और एंटर दबाएँ। तब आप 'विंडो ऑब्जेक्ट' के लिए DOM प्रॉपर्टीज़ देख सकते हैं। जब आप ऑब्जेक्ट को ढहाते हैं तो आप 'क्रोम' संपत्ति सहित सभी गुण देख सकते हैं।

आप IE के लिए जाँच करने के लिए कड़ाई से सच के बराबर उपयोग नहीं कर सकते window.chrome। आईई undefinedलौटती थी, अब लौटती है true। लेकिन लगता है क्या, IE11 अब फिर से अपरिभाषित लौटता है। IE11 भी के ""लिए एक खाली स्ट्रिंग देता है window.navigator.vendor।

आशा है कि ये आपकी मदद करेगा!

अपडेट करें:

नीचे इंगित करने के लिए Halcyon991 के लिए धन्यवाद , कि नया ओपेरा 18+ भी सच के लिए आउटपुट देता है window.chrome। ओपेरा 18 जैसा दिखता क्रोमियम 31 पर आधारित है । इसलिए मैंने यह सुनिश्चित करने के लिए एक चेक जोड़ा window.navigator.vendor: "Google Inc"और नहीं है "Opera Software ASA"। इसके अलावा, रिंग और एड्रियन के लिए धन्यवाद क्रोम 33 के बारे में प्रमुखों के लिए अब सच नहीं लौट रहा है ... window.chromeअब जांचता है कि क्या अशक्त नहीं है। लेकिन IE11 के लिए करीब ध्यान दें, मैंने IE11 के लिए चेक वापस जोड़ा undefinedक्योंकि अब undefinedयह आउटपुट करता है , जब यह पहली बार रिलीज हुआ था .. तब कुछ अपडेट के बाद इसे आउटपुट किया गया था true.. अब हालिया अपडेट बिल्ड undefinedफिर से आउटपुट कर रहा है। Microsoft यह मन नहीं बना सकता है!

UPDATE 7/24/2015 - ओपेरा चेक के लिए इसके अलावा

ओपेरा 30 अभी रिलीज हुई थी। यह अब आउटपुट नहीं है window.opera। और window.chromeनए ओपेरा 30 में भी सही होने के लिए आउटपुट। इसलिए आपको यह जांचना होगा कि OPR उपयोगकर्ता में है या नहीं । मैंने ओपेरा 30 में इस नए बदलाव के लिए अपनी स्थिति को ऊपर से अपडेट किया, क्योंकि यह Google Chrome के समान रेंडर इंजन का उपयोग करता है।

अद्यतन 10/13/2015 - IE जांच के लिए इसके अलावा

कारण यह outputting के लिए आईई एज के लिए चेक जोड़ी trueके लिए window.chromeभले ही IE11 आउटपुट .. undefinedके लिए window.chrome। इस बारे में हमें बताने के लिए आर्टफुलहैकर का धन्यवाद !

अद्यतन 2/5/2016 - आईओएस क्रोम की जाँच के लिए इसके अलावा

IOS पर क्रोम CriOSके लिए आउटपुट trueदेने के कारण iOS क्रोम चेक के लिए जोड़ा गया चेक । हमें इस बारे में बताने के लिए xinthose का धन्यवाद !

UPDATE 4/18/2018 - ओपेरा चेक के लिए परिवर्तन

ओपेरा के लिए संपादित चेक, जाँच अब से window.oprनहीं है undefinedक्योंकि Chrome 66 में OPRहै window.navigator.vendor। इस रिपोर्ट के लिए फ्रॉस्टी जेड और डैनियल वालेमैन का धन्यवाद !

Comments

यह IE10 के लिए काम नहीं करता है। IE10 रिटर्न में typeof window.chrome {ऑब्जेक्ट}

— मैजिट्रेट

var isGoogleChrome = window.chrome! = null && window.navigator.vendor === "Google Inc.";

— रिंग

धन्यवाद @xinthose .. मैंने अभी IOS Chrome के लिए एक चेक जोड़ा है .. बहुत सराहना की! :)

— जोनाथन मारजुल्लो

शायद यहाँ डैनियल वालेमैन के रूप में एक ही समस्या है: मेरे Android क्रोम उपयोगकर्ता एजेंट में "OPR" स्ट्रिंग है! 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इसलिए isChrome()रिटर्न झूठी ।

— फ्रॉस्टी जेड

हमें बताने के लिए @FrostyZ और @DanielWallman का शुक्रिया। मैंने इसे ठीक कर लिया है ताकि ओपेरा चेक window.oprन हो undefined।

— जोनाथन मार्जुलो

Answer 3

और भी छोटा: var is_chrome = /chrome/i.test( navigator.userAgent );

Comments

trueMicrosoft एज में लौटें ।

— २

Answer 4

एक बहुत ही सरल समाधान सिर्फ उपयोग करने के लिए है:

var isChrome = !!window.chrome;

!!बस एक बूलियन मान को वस्तु बदल देता है। गैर-क्रोम ब्राउज़रों में, यह संपत्ति होगी undefined, जो सत्य नहीं है।

ध्यान दें कि यह एज के संस्करणों के लिए भी सच है जो क्रोम पर आधारित हैं (धन्यवाद @ इसको इंगित करने के लिए)।

Comments

ओपेरा वास्तव में लौटता trueहै window.chrome। बाहर की जाँच करें conditionizr.com जिसमें बुलेटप्रूफ डिटेक्ट + फिक्स है।

— हेलसीऑन 991

खैर, ओपेरा मूल रूप से क्रोम है

— करेल बिलेक

मुझे समझ में नहीं आता कि दो बार क्यों !! , u सीधे उपयोग कर सकते हैं, अगर (क्रोम) {}

— विशाल शर्मा

@vishalsharma, !!मान को trueया तो परिवर्तित करता है या false। typeof(window.chrome)देता है "object", जबकि typeof(!!window.chrome)देता है "boolean"। आपका कोड नमूना भी काम करता है क्योंकि ifबयान रूपांतरण करता है।

— ड्रू नोक

यह trueएज के लिए भी वापसी करता है।

— कार्म

Answer 5

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

Comments

दुर्भाग्य से, navigator.vendor === "Google Inc." ओपेरा पर (कम से कम v.49) तो आपके कोड का उपयोग करके ओपेरा क्रोम के रूप में दिखाई देता है।

— वोजटेक मेजर्सकी

दुनिया में कहीं न कहीं एक बिल्ली का बच्चा हर रेगीक्स के लिए मर जाता है जिसकी हमें वास्तव में जरूरत नहीं है।

— एस.जे.

कोई स्पष्टीकरण नहीं, झूठे सकारात्मक / नकारात्मक पर कोई संकेत नहीं, बस यहां डंप किया गया एक कोड ... इस प्रतिक्रिया को वास्तव में कम किया जाना चाहिए। यह पूछे गए प्रश्न का उत्तर भी नहीं है।

— अलेक्जेंड्रे जर्मेन

Answer 6

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

Comments

मुझे यह पसंद आया, याद रखें कि आप var is_chrome = /chrome/i.test(navigator.userbgent) भी कर सकते हैं; भी

— एलनफॉस्टर

trueमाइक्रोसॉफ्ट एज में वापसी ।

— २

@ लॉबी: सभी उचित सम्मान के साथ, एज उस समय जारी नहीं किया गया था। जानकारी के लिए धन्यवाद :)

— नवीन

Answer 7

आप क्रोम का विशिष्ट संस्करण भी चाहते हैं:

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

माई के भीतर अपने जवाब का उपयोग करने के लिए द बिग लेबोव्स्की से माफी।

Comments

संस्करण "537.36"Microsoft एज में है।

— 2

Answer 8

आप उपयोग कर सकते हैं:

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

यह v.71 पर काम कर रहा है

Comments

navigator.userAgent.includes("Chrome")

— एलेक्स ज़ुक्स 14

Answer 9

मैक पर क्रोम पर मेरे लिए काम करता है। उपरोक्त सभी की तुलना में सरल या अधिक विश्वसनीय (मामले में userAgent string परीक्षण किए गए) होना या होना प्रतीत होता है।

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

Comments

const isChrome = window.chrome && !window.opr;

— ifeelbadformyoldquestions

Answer 10

उपयोगकर्ता उपयोगकर्ता एजेंट बदल सकता है। तत्व की वस्तु webkitमें पूर्वनिर्मित संपत्ति के लिए परीक्षण का प्रयास करेंstylebody

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

Comments

फ़ायरफ़ॉक्स में: ("webkitAnimation" में document.body.style) === सच

— टॉमस प्राडो

FYI करें: 'webkitAppearance' अब भी काम नहीं करता है। एज अब इसका इस्तेमाल कर रहा है। अपने उत्तर को हटाने के लिए शायद सबसे अच्छा। ^ ^

— हेक्सालिस

Answer 11

इसे देखें: सफारी, क्रोम, IE, फ़ायरफ़ॉक्स और ओपेरा ब्राउज़र का पता कैसे लगाएं?

आपके मामले में: varChrome = !! window.chrome && (!! window.chrome.webstore || !! window.chrome.runtime) है?

Answer 12

विभिन्न डेस्कटॉप ब्राउज़र (फ़ायरफ़ॉक्स, IE, ओपेरा, एज, क्रोम) के नाम जानने के लिए। सिवाय सफारी के।

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;
}

निम्नलिखित ब्राउज़र संस्करणों में काम करता है:

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)

सार देखें यहाँ और बेला यहाँ

मूल कोड स्निपेट ने अब क्रोम के लिए काम नहीं किया और मैं भूल गया कि मुझे यह कहां मिला है। इसमें पहले सफारी थी लेकिन अब मेरी सफारी तक पहुंच नहीं है इसलिए मैं अब सत्यापन नहीं कर सकता।

केवल फ़ायरफ़ॉक्स और IE कोड मूल स्निपेट का हिस्सा थे।

ओपेरा, एज और क्रोम के लिए जाँच सीधे आगे है। उपयोगकर्ताएजेंट में उनके अंतर हैं। OPRकेवल ओपेरा में मौजूद है। Edgeकेवल एज में मौजूद है। तो क्रोम के लिए जांच करने के लिए ये स्ट्रिंग नहीं होना चाहिए।

फ़ायरफ़ॉक्स और IE के लिए, मैं समझा नहीं सकता कि वे क्या करते हैं।

मैं इस कार्यक्षमता को एक पैकेज लिख रहा हूँ

Answer 13

सभी उत्तर गलत हैं। "ओपेरा" और "क्रोम" सभी मामलों में समान हैं।

(संपादित हिस्सा)

यहाँ सही जवाब है

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

Comments

उत्तर की तुलना में बेहतर टिप्पणी।

— जैस कॉटन

मामले में आप सोच रहे हैं कि आप नीचे क्यों लगाए गए थे, यह केवल सच नहीं है। एक उदाहरण के लिए, वे कीबोर्ड शॉर्टकट्स को संभालते हैं और कुंजी संशोधक को अलग तरीके से एक्सेस करते हैं (और ये भी पता नहीं लगाया जा सकता है)।

— जिल्क

मैं यह नहीं कहता कि 'ओपेरा' और 'क्रोम' एक ही ब्राउज़र है, केवल आइकन अलग है। मैं कहता हूं कि ऊपर वर्णित विधियां दोनों ब्राउज़रों के लिए समान परिणाम दे रही हैं।

— अरर्ट हरूटुनियन

@Zilk क्या आपने पहले उत्तर के लिए परीक्षण किया है जिसमें 66 वोट हैं?

— अरर्ट हरुट्युनियन

यह अब क्रोम 71 के रूप में काम नहीं करेगा। window.chrome.webstoreअब हैundefined

— एस्टेबन