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


822

मेरे पास एफएफ, क्रोम, आईई, ओपेरा और सफारी के लिए 5 एडऑन / एक्सटेंशन हैं।

मैं संबंधित ब्राउज़र डाउनलोड करने के लिए उपयोगकर्ता ब्राउज़र और रीडायरेक्ट (एक बार इंस्टॉल बटन पर क्लिक करने के बाद) को कैसे पहचान सकता हूं?


2
डेटज का प्रयास करें, इसका उपयोग सभी ब्राउज़रों के लिए किया जा सकता है
दोस्त


2
Det.js अब बनाए नहीं रखा गया है ( github.com/darcyclarke/Detect.js के अनुसार ), वे github.com/lancedikson/bowser
YakovL

मैंने UAParser Plugin का उपयोग किया है, यह वेनिला जावास्क्रिप्ट में लिखा है। स्रोत: जावास्क्रिप्ट का उपयोग करके ब्राउज़र, इंजन, ओएस, सीपीयू और डिवाइस का पता कैसे लगाएं?
लूजान बराल

जवाबों:


1687

ब्राउज़र विश्वसनीय खोज के लिए गुग्लिंग करने से अक्सर उपयोगकर्ता एजेंट स्ट्रिंग की जाँच होती है। यह विधि विश्वसनीय नहीं है, क्योंकि यह इस मूल्य को खराब करने के लिए तुच्छ है।
मैंने बतख-टाइप करके ब्राउज़रों का पता लगाने के लिए एक विधि लिखी है ।

केवल ब्राउज़र का पता लगाने की विधि का उपयोग करें यदि यह वास्तव में आवश्यक है, जैसे कि एक्सटेंशन को स्थापित करने के लिए ब्राउज़र-विशिष्ट निर्देश दिखाना। जब संभव हो तो फीचर डिटेक्शन का उपयोग करें।

डेमो: https://jsfiddle.net/6spj1059/

// Opera 8.0+
var isOpera = (!!window.opr && !!opr.addons) || !!window.opera || navigator.userAgent.indexOf(' OPR/') >= 0;

// Firefox 1.0+
var isFirefox = typeof InstallTrigger !== 'undefined';

// Safari 3.0+ "[object HTMLElementConstructor]" 
var isSafari = /constructor/i.test(window.HTMLElement) || (function (p) { return p.toString() === "[object SafariRemoteNotification]"; })(!window['safari'] || (typeof safari !== 'undefined' && safari.pushNotification));

// Internet Explorer 6-11
var isIE = /*@cc_on!@*/false || !!document.documentMode;

// Edge 20+
var isEdge = !isIE && !!window.StyleMedia;

// Chrome 1 - 79
var isChrome = !!window.chrome && (!!window.chrome.webstore || !!window.chrome.runtime);

// Edge (based on chromium) detection
var isEdgeChromium = isChrome && (navigator.userAgent.indexOf("Edg") != -1);

// Blink engine detection
var isBlink = (isChrome || isOpera) && !!window.CSS;


var output = 'Detecting browsers by ducktyping:<hr>';
output += 'isFirefox: ' + isFirefox + '<br>';
output += 'isChrome: ' + isChrome + '<br>';
output += 'isSafari: ' + isSafari + '<br>';
output += 'isOpera: ' + isOpera + '<br>';
output += 'isIE: ' + isIE + '<br>';
output += 'isEdge: ' + isEdge + '<br>';
output += 'isEdgeChromium: ' + isEdgeChromium + '<br>';
output += 'isBlink: ' + isBlink + '<br>';
document.body.innerHTML = output;

विश्वसनीयता का विश्लेषण

पिछले विधि प्रतिपादन इंजन (के गुणों पर निर्भर -moz-box-sizingऔर -webkit-transform) ब्राउज़र पता लगाने के लिए। इन उपसर्गों को अंततः गिरा दिया जाएगा, इसलिए पता लगाने को और भी अधिक मजबूत बनाने के लिए, मैंने ब्राउज़र-विशिष्ट विशेषताओं पर स्विच किया:

  • Internet Explorer: JScript का सशर्त संकलन (IE9 तक) और document.documentMode
  • एज: ट्राइडेंट और एज ब्राउज़र में, माइक्रोसॉफ्ट का कार्यान्वयन StyleMediaकंस्ट्रक्टर को उजागर करता है । ट्राइडेंट को छोड़कर हमें एज के साथ छोड़ देता है।
  • एज (क्रोमियम पर आधारित): उपयोगकर्ता एजेंट में अंत में मूल्य "Edg / [संस्करण]" (पूर्व: "मोज़िला / 5.0 (विंडोज NT 10.0; Win64; x64) AppleWebKit / 537.36 (KHTML, Gecko की तरह) क्रोम / शामिल हैं। 80.0.3987.16 सफारी / 537.36 एडग / 80.0.361.9 ")।
  • फ़ायरफ़ॉक्स: फ़ायरफ़ॉक्स एपीआई ऐड-ऑन स्थापित करने के लिए: InstallTrigger
  • Chrome: वैश्विक chromeऑब्जेक्ट, जिसमें एक प्रलेखित chrome.webstoreऑब्जेक्ट सहित कई गुण हैं ।
  • अपडेट 3 chrome.webstoreहाल के संस्करणों में पदावनत और अपरिभाषित है
  • सफारी: निर्माणकर्ताओं के नामकरण में एक अद्वितीय नामकरण पैटर्न। यह सभी सूचीबद्ध संपत्तियों की सबसे कम टिकाऊ विधि है और अनुमान लगाते हैं कि क्या है? सफारी में 9.1.3 तय की गई थी। इसलिए हम इसके खिलाफ जाँच कर रहे हैं SafariRemoteNotification, जिसे 3.0 के बाद और 3.0 से ऊपर की सभी सफारियों को कवर करने के लिए 7.1 संस्करण के बाद पेश किया गया था।
  • ओपेरा: window.operaवर्षों से अस्तित्व में है, लेकिन जब ओपेरा अपने इंजन को ब्लिंक + वी 8 (क्रोमियम द्वारा उपयोग किया जाता है) के साथ बदल देता है, तो उसे छोड़ दिया जाएगा
  • अद्यतन 1: ओपेरा 15 जारी किया गया है , इसका यूए स्ट्रिंग क्रोम जैसा दिखता है, लेकिन "ओपीआर" के अतिरिक्त के साथ। इस संस्करण में chromeऑब्जेक्ट को परिभाषित किया गया है (लेकिन chrome.webstoreऐसा नहीं है)। चूंकि ओपेरा क्रोम को क्लोन करने के लिए कड़ी मेहनत करता है, इसलिए मैं इस उद्देश्य के लिए उपयोगकर्ता एजेंट को सूँघता हूं।
  • अपडेट 2: ओपेरा 20+ (सदाबहार) !!window.opr && opr.addonsका पता लगाने के लिए इस्तेमाल किया जा सकता है ।
  • पलक: Google में Chrome 28 पर स्विच CSS.supports() किए जाने के बाद ब्लिंक में पेश किया गया था

इसमें सफलतापूर्वक परीक्षण किया गया:

  • फ़ायरफ़ॉक्स 0.8 - 61
  • क्रोम 1.0 - 71
  • ओपेरा 8.0 - 34
  • सफारी 3.0 - 10
  • IE 6 - 11
  • बढ़त- 20-42
  • एज देव - 80.0.361.9

नवंबर 2016 में अपडेट किया गया। इसमें 9.1.3 और ऊपर से सफारी ब्राउज़रों का पता लगाना शामिल है

अगस्त 2018 में क्रोम, फ़ायरफ़ॉक्स आईई और किनारे पर नवीनतम सफल परीक्षणों को अपडेट करने के लिए अपडेट किया गया।

जनवरी 2019 में क्रोम डिटेक्शन को ठीक करने के लिए अपडेट किया गया (क्योंकि window.chrome.webstore डिप्रेसेशन है) और क्रोम पर नवीनतम सफल परीक्षण शामिल हैं।

क्रोमियम डिटेक्शन (@ निमेश टिप्पणी के आधार पर) पर आधारित एज को जोड़ने के लिए दिसंबर 2019 में अपडेट किया गया।


5
FYI करें यह क्रोम एक्सटेंशन के साथ काम नहीं करता है क्योंकि window.chrome.webstoreवहां अपरिभाषित है। फ़ायरफ़ॉक्स एक्सटेंशन के साथ इसकी जाँच नहीं की गई। is.jsकहीं और उल्लेख क्रोम और फ़ायरफ़ॉक्स एक्सटेंशन दोनों में काम करता है।
nevf

60
isSafariसफारी 10 के साथ काम नहीं करता है। मेरा तर्क है कि यह एक बुरा समाधान है (ऐसा नहीं है कि मेरे पास एक अच्छा है)। ऐसी कोई गारंटी नहीं है कि आपके द्वारा चेक की गई चीजों में से कई को हटाया नहीं जाएगा या अन्य ब्राउज़रों द्वारा नहीं जोड़ा जाएगा। प्रत्येक साइट जो सफारी के लिए चेक के लिए इस कोड का उपयोग कर रही थी, बस
macOS

10
लेकिन क्या यह उन ब्राउज़रों के मोबाइल संस्करणों के साथ-साथ डेस्कटॉप संस्करणों पर भी परीक्षण किया गया है? और सच कहूँ तो, अलग-अलग मोबाइल संस्करण और प्रति प्लेटफ़ॉर्म अलग-अलग डेस्कटॉप संस्करण हैं। तो वास्तव में, फ़ायरफ़ॉक्स में विंडोज, लिनक्स, मैक ओएस और एंड्रॉइड और आईओएस के लिए 2 बायनेरिज़ के लिए 3 बायनेरी हैं।
DrZ214

3
वर्तमान isSafariके तहत काम नहीं करता है <iframe>सफारी 10.1.2 के तहत
मिक्को Ohtamaa

23
window.chrome.webstore को Chrome ver से शुरू किया गया है। 71: blog.chromium.org/2018/06/…
st_bk

133

आप ब्राउज़र संस्करण की जाँच करने के लिए निम्न तरीके से कोशिश कर सकते हैं।

    <!DOCTYPE html>
    <html>
    <body>
    <p>What is the name(s) of your browser?</p>
    <button onclick="myFunction()">Try it</button>
    <p id="demo"></p>
    <script>

    function myFunction() { 
     if((navigator.userAgent.indexOf("Opera") || navigator.userAgent.indexOf('OPR')) != -1 ) 
    {
        alert('Opera');
    }
    else if(navigator.userAgent.indexOf("Chrome") != -1 )
    {
        alert('Chrome');
    }
    else if(navigator.userAgent.indexOf("Safari") != -1)
    {
        alert('Safari');
    }
    else if(navigator.userAgent.indexOf("Firefox") != -1 ) 
    {
         alert('Firefox');
    }
    else if((navigator.userAgent.indexOf("MSIE") != -1 ) || (!!document.documentMode == true )) //IF IE > 10
    {
      alert('IE'); 
    }  
    else 
    {
       alert('unknown');
    }
    }
    </script>

    </body>
    </html>

और अगर आपको केवल IE ब्राउज़र संस्करण को जानने की आवश्यकता है तो आप नीचे दिए गए कोड का अनुसरण कर सकते हैं। यह कोड संस्करण IE6 से IE11 के लिए अच्छी तरह से काम करता है

<!DOCTYPE html>
<html>
<body>

<p>Click on Try button to check IE Browser version.</p>

<button onclick="getInternetExplorerVersion()">Try it</button>

<p id="demo"></p>

<script>
function getInternetExplorerVersion() {
   var ua = window.navigator.userAgent;
        var msie = ua.indexOf("MSIE ");
        var rv = -1;

        if (msie > 0 || !!navigator.userAgent.match(/Trident.*rv\:11\./))      // If Internet Explorer, return version number
        {               

            if (isNaN(parseInt(ua.substring(msie + 5, ua.indexOf(".", msie))))) {
                //For IE 11 >
                if (navigator.appName == 'Netscape') {
                    var ua = navigator.userAgent;
                    var re = new RegExp("Trident/.*rv:([0-9]{1,}[\.0-9]{0,})");
                    if (re.exec(ua) != null) {
                        rv = parseFloat(RegExp.$1);
                        alert(rv);
                    }
                }
                else {
                    alert('otherbrowser');
                }
            }
            else {
                //For < IE11
                alert(parseInt(ua.substring(msie + 5, ua.indexOf(".", msie))));
            }
            return false;
        }}
</script>

</body>
</html>

3
कोड की इतनी सारी पंक्तियों को कोई क्यों लिखेगा? userAgent अस्पष्ट है।
इगौरव

5
Microsoft एज के बारे में क्या?
user6031759

3
सफारी के लिए जाँच करने से पहले क्रोम के लिए चेक के ऊपर जवाब। क्योंकि chromeयूजररी में सफारी में कीवर्ड नहीं होगा । सफारी यूजरेज का उदाहरण -mozilla/5.0 (macintosh; intel mac os x 10_11_5) applewebkit/601.6.17 (khtml, like gecko) version/9.1.1 safari/601.6.17
गोलक सारंगी

11
Stackoverflow इस विधि का उपयोग करता है
vityavv 14

3
जब यह ओपेरा (नवीनतम संस्करण) में परीक्षण करता है, तो यह मेरे लिए 'क्रोम' देता है। इसे ठीक करने के लिए, मैंने ओपेरा को स्टेटमेंट में बदल दिया:if(navigator.userAgent.indexOf("Opera") != -1 || navigator.userAgent.indexOf('OPR') != -1 )
काइल वासेला

60

मुझे पता है कि इसके लिए एक लीवर का उपयोग करना ओवरकिल हो सकता है, लेकिन सिर्फ धागे को समृद्ध करने के लिए, आप जांच कर सकते हैं । ऐसा करने का तरीका:

is.firefox();
is.ie(6);
is.not.safari();

9
बस ध्यान देने योग्य है कि हुड के तहत यह मुख्य रूप से उपयोगकर्ता-एजेंट का पता लगा रहा है। स्थानों में विक्रेता का पता लगाने / कुछ सुविधा का पता लगाने के साथ पूरक।
टाइगरक्रैश

1
@TygerKrash यकीन है, आप बिलकुल सही हैं। यह वास्तव में मेरे जवाब के साथ मेरा मतलब था: स्रोत कोड खोलें is.jsऔर जांचें कि वे यह कैसे करते हैं।
राफेल Eyng

4
jQuery में समान गुण शामिल होते थे: $ .browser.msie ... संस्करण 1.9 से हटाए गए थे api.jquery.com/jquery.browser
रीगा

@ RafaelEyng: मुझे लगता है कि उपयोगकर्ता-एजेंट का पता लगाने के साथ यह मुद्दा अविश्वसनीय है।
होल्डऑफहुंगर

यह निश्चित रूप से सबसे मजबूत दृष्टिकोण है जब आप मानते हैं कि यूए स्ट्रिंग को संशोधित नहीं किया गया है। यह ओएस (एंड्रॉइड, विन, मैक, लिनक्स) का भी ठीक से पता लगाता है; डिवाइस प्रकार (डेस्कटॉप, टैबलेट, मोबाइल)। यह ब्राउज़र के संस्करण के लिए भी परीक्षण कर सकता है।
काशीराज

51

यहां कई प्रमुख लाइब्रेरी हैं जो दिसंबर 2019 तक ब्राउज़र डिटेक्शन को संभालती हैं।

Bowser lancedikson द्वारा - 4065 ★ रों - अंतिम बार अपडेट अक्टू 2, 2019 - 4.8KB

var result = bowser.getParser(window.navigator.userAgent);
console.log(result);
document.write("You are using " + result.parsedResult.browser.name +
               " v" + result.parsedResult.browser.version + 
               " on " + result.parsedResult.os.name);
<script src="https://unpkg.com/bowser@2.7.0/es5.js"></script>

* क्रोमियम पर आधारित एज का समर्थन करता है


Platform.js द्वारा bestiejs - 2,550 ★ s - अंतिम अद्यतन अप्रैल 14, 2019 - 5.9KB

console.log(platform);
document.write("You are using " + platform.name +
               " v" + platform.version + 
               " on " + platform.os);
<script src="https://cdnjs.cloudflare.com/ajax/libs/platform/1.3.5/platform.min.js"></script>

gabceb द्वारा jQuery ब्राउज़र - 504 ★ s - अंतिम अपडेट 23 नवंबर, 2015 - 1.3 केबी

console.log($.browser)
document.write("You are using " + $.browser.name +
               " v" + $.browser.versionNumber + 
               " on " + $.browser.platform);
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-browser/0.1.0/jquery.browser.min.js"></script>

Darcyclarke द्वारा Detect.js (संग्रहीत) - 522 ★ s - अंतिम अद्यतन 26 अक्टूबर, 2015 - 2.9KB

var result = detect.parse(navigator.userAgent);
console.log(result);
document.write("You are using " + result.browser.family +
               " v" + result.browser.version + 
               " on " + result.os.family);
<script src="https://cdnjs.cloudflare.com/ajax/libs/Detect.js/2.2.2/detect.min.js"></script>

QuirksMode द्वारा ब्राउज़र डिटेक्ट (संग्रहीत) - अंतिम अपडेट 14 नवंबर, 2013 - 884 बी

console.log(BrowserDetect)
document.write("You are using " + BrowserDetect.browser +
               " v" + BrowserDetect.version + 
               " on " + BrowserDetect.OS);
<script src="https://kylemit.github.io/libraries/libraries/BrowserDetect.js"></script>


उल्लेखनीय उल्लेख:

  • WhichBrowser - 1,355 ★ s - अंतिम अद्यतन अक्टूबर 2, 2018
  • Modernizr - 23,397 ★ रों - अंतिम बार अपडेट जनवरी 12, 2019 - एक खिलाया घोड़े को खिलाने के लिए, यह सुविधा का पता लगाने के लिए किसी भी ड्राइव चाहिए canIuse शैली सवाल। ब्राउज़र का पता लगाना वास्तव में केवल अनुकूलित चित्र, डाउनलोड फ़ाइलें, या व्यक्तिगत ब्राउज़र के लिए निर्देश प्रदान करने के लिए है।

आगे की पढाई


1
पहिया को सुदृढ़ नहीं करने के लिए ओवरहेड के कुछ Kb लायक है।
ग्लिफ़

46

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

/**
 * Gets the browser name or returns an empty string if unknown. 
 * This function also caches the result to provide for any 
 * future calls this function has.
 *
 * @returns {string}
 */
var browser = function() {
    // Return cached result if avalible, else get result then cache it.
    if (browser.prototype._cachedResult)
        return browser.prototype._cachedResult;

    // Opera 8.0+
    var isOpera = (!!window.opr && !!opr.addons) || !!window.opera || navigator.userAgent.indexOf(' OPR/') >= 0;

    // Firefox 1.0+
    var isFirefox = typeof InstallTrigger !== 'undefined';

    // Safari 3.0+ "[object HTMLElementConstructor]" 
    var isSafari = /constructor/i.test(window.HTMLElement) || (function (p) { return p.toString() === "[object SafariRemoteNotification]"; })(!window['safari'] || safari.pushNotification);

    // Internet Explorer 6-11
    var isIE = /*@cc_on!@*/false || !!document.documentMode;

    // Edge 20+
    var isEdge = !isIE && !!window.StyleMedia;

    // Chrome 1+
    var isChrome = !!window.chrome && !!window.chrome.webstore;

    // Blink engine detection
    var isBlink = (isChrome || isOpera) && !!window.CSS;

    return browser.prototype._cachedResult =
        isOpera ? 'Opera' :
        isFirefox ? 'Firefox' :
        isSafari ? 'Safari' :
        isChrome ? 'Chrome' :
        isIE ? 'IE' :
        isEdge ? 'Edge' :
        isBlink ? 'Blink' :
        "Don't know";
};

console.log(browser());


2
एज ब्राउजर में, यह Chrome
Riz

2
@eFriend मैंने नवीनतम ब्राउज़र परीक्षणों के उत्तर को अपडेट किया।
पिलाउ

4
मुझे यह पसंद है, लेकिन मैंने "पता नहीं" के बजाय, उपयोगकर्ताएजेंट () को एक कमबैक पसंद किया होगा।
होल्डऑफ ह्यूंगर

2
window.chrome.webstoreक्रोम 71 में संपत्ति को हटा दिया गया था, इसलिए यह दृष्टिकोण अब काम नहीं कर रहा है।
बेदला

आप एक फ़ंक्शन के साथ फ़ंक्शन को ओवरराइट कर सकते हैं जो कि केवल कैश किए गए कैश को लौटाता है और अगर स्टेटमेंट को छोड़ देता है। आपके आस-पास पहली बार अभी भी परिणाम वापस करना है। ब्राउज़र = फ़ंक्शन () {रिटर्न कैश्डResult}; वापसी कैश्ड
तिमार इवो बत्तीस

22

लघु रूप

var browser = (function() {
    var test = function(regexp) {
        return regexp.test(window.navigator.userAgent);
    }
    switch (true) {
        case test(/edg/i): return "edge";
        case test(/opr/i) && (!!window.opr || !!window.opera): return "opera";
        case test(/chrome/i) && !!window.chrome: return "chrome";
        case test(/trident/i): return "ie";
        case test(/firefox/i): return "firefox";
        case test(/safari/i): return "safari";
        default: return "other";
    }
})();
console.log(browser)


यदि आप मुझे नापसंद करते हैं, तो कृपया इसकी व्याख्या करें।
एलेक्स निकुलिन

2
यह
रेजा

11

यहाँ Microsoft के किनारे और ब्लिंक का पता लगाने सहित रोब के उत्तर का एक समायोजित संस्करण है:

( संपादित करें : मैंने इस जानकारी के साथ रोब के उत्तर को अपडेट किया है।)

// Opera 8.0+ (UA detection to detect Blink/v8-powered Opera)
isOpera = !!window.opera || navigator.userAgent.indexOf(' OPR/') >= 0;
// Firefox 1.0+
isFirefox = typeof InstallTrigger !== 'undefined';
// Safari 3.0+
isSafari = /constructor/i.test(window.HTMLElement) || (function (p) { return p.toString() === "[object SafariRemoteNotification]"; })(!window['safari'] || safari.pushNotification);
// Internet Explorer 6-11
isIE = /*@cc_on!@*/false || !!document.documentMode;
// Edge 20+
isEdge = !isIE && !!window.StyleMedia;
// Chrome 1+
isChrome = !!window.chrome && !!window.chrome.webstore;
// Blink engine detection
isBlink = (isChrome || isOpera) && !!window.CSS;

/* Results: */
console.log("isOpera", isOpera);
console.log("isFirefox", isFirefox);
console.log("isSafari", isSafari);
console.log("isIE", isIE);
console.log("isEdge", isEdge);
console.log("isChrome", isChrome);
console.log("isBlink", isBlink);

इस दृष्टिकोण की सुंदरता यह है कि यह ब्राउज़र इंजन गुणों पर निर्भर करता है, इसलिए यह यहां तक ​​कि व्युत्पन्न ब्राउज़रों को भी कवर करता है, जैसे कि Yandex या Vivaldi, जो व्यावहारिक रूप से उन प्रमुख ब्राउज़रों के साथ संगत हैं जिनके इंजन वे उपयोग करते हैं। अपवाद ओपेरा है, जो उपयोगकर्ता एजेंट को सूँघने पर निर्भर करता है, लेकिन आज (यानी 15 और ऊपर) भी ओपेरा ही पलक के लिए केवल एक खोल है।


!!window.MSAssertion;परीक्षण दूरस्थ डेस्कटॉप के माध्यम एज बीटा में मेरे लिए काम नहीं करता। यह झूठा लौटता है।
NoR

@ नोआर एज के किस संस्करण का उपयोग कर रहे हैं? यह मायने रखता है
pilau

1
@NoR ओह आप वीएम का उपयोग कर रहे हैं ... MSAssertionचाल को संस्करण 25 में समायोजित किया गया है। लेकिन चूंकि कई देवता वीएम पर भरोसा करते हैं, इसलिए मैं इसे इस पुराने संस्करण को समायोजित करने का प्रयास करूंगा। अच्छा निर्णय। धन्यवाद।
पिलाऊ

1
@NoR अपडेटेड - फ्यूचरप्रूफ होना चाहिए। StyleMedia(पूंजीकृत) वस्तु IE और एज लिए विशिष्ट है और कहीं भी जा रहा करने के लिए प्रतीत नहीं होता।
पिलाऊ

1
मैंने UAParser को एक js प्लगइन भी पाया है जो अभी भी बना हुआ है और उपयोग करने में बेहद सटीक और आसान है।
इस्साक गैबले

9

आप विभिन्न ब्राउज़र त्रुटि संदेशों का उपयोग tryऔर उपयोग कर सकते हैं catch। IE और किनारे को मिलाया गया था, लेकिन मैंने रोब डब्ल्यू (इस परियोजना पर आधारित: https://www.khanacademy.org/computer-programming/i-have-opera/2395080328 ) से डक टाइपिंग का उपयोग किया ।

var getBrowser = function() {        
    try {
        var e;
        var f = e.width;
    } catch(e) {
        var err = e.toString();

        if(err.indexOf("not an object") !== -1) {
            return "safari";
        } else if(err.indexOf("Cannot read") !== -1) {
            return "chrome";
        } else if(err.indexOf("e is undefined") !== -1) {
            return "firefox";
        } else if(err.indexOf("Unable to get property 'width' of undefined or null reference") !== -1) {
            if(!(false || !!document.documentMode) && !!window.StyleMedia) {
                return "edge";
            } else {
                return "IE";
            }
        } else if(err.indexOf("cannot convert e into object") !== -1) {
            return "opera";
        } else {
            return undefined;
        }
    }
};

यह एक महान विचार है: आपको न तो "विंडो" की आवश्यकता है, न ही "नेविगेटर" वस्तुओं की!
वादिम

मेरा सुझाव पूरी तरह से दस्तावेज़ और खिड़की से छुटकारा पाने के लिए है। आईई चंक देखें: "फ़ायरफ़ॉक्स" लौटें; } और (if.search ("[ऑब्जेक्ट त्रुटि]")! == -1 && e.message! = null && e.description! = null) {वापसी "IE" } और (if.search ("ऑब्जेक्ट में e को कनवर्ट नहीं कर सकता")! == -1) {रिटर्न "ओपेरा";
वादिम

कैसे IE और बढ़त के बीच अंतर करता है?
मेसन जोन्स

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

बस इसका कारण पता लगा। ऐसा लगता है कि पीएसी फ़ाइल को मज़ेदार बनाने के लिए विंडोज 7 में IE11 का उपयोग नहीं किया गया है, जो मेरी मशीन पर स्थापित है, बल्कि IE7- जैसा इंजन (शायद विंडोज होस्ट से)। तो इरेटिंग () ("ऑब्जेक्ट एरर") देता है जबकि IE11 के अंदर यह आपके कोड में "संपत्ति पाने में असमर्थ ..." स्ट्रिंग देता है। तो, उपरोक्त कोड IE7 के साथ विफल होना चाहिए।
वादिम

8

आप सबको धन्यवाद। मैंने हाल के ब्राउज़रों पर यहां कोड स्निपेट्स का परीक्षण किया: क्रोम 55, फ़ायरफ़ॉक्स 50, आईई 11 और एज 38 और मैं निम्नलिखित संयोजन के साथ आया जो उन सभी के लिए मेरे लिए काम करते थे। मुझे यकीन है कि इसमें सुधार किया जा सकता है, लेकिन जो कोई भी जरूरत है उसके लिए यह एक त्वरित समाधान है:

var browser_name = '';
isIE = /*@cc_on!@*/false || !!document.documentMode;
isEdge = !isIE && !!window.StyleMedia;
if(navigator.userAgent.indexOf("Chrome") != -1 && !isEdge)
{
    browser_name = 'chrome';
}
else if(navigator.userAgent.indexOf("Safari") != -1 && !isEdge)
{
    browser_name = 'safari';
}
else if(navigator.userAgent.indexOf("Firefox") != -1 ) 
{
    browser_name = 'firefox';
}
else if((navigator.userAgent.indexOf("MSIE") != -1 ) || (!!document.documentMode == true )) //IF IE > 10
{
    browser_name = 'ie';
}
else if(isEdge)
{
    browser_name = 'edge';
}
else 
{
   browser_name = 'other-browser';
}
$('html').addClass(browser_name);

यह ब्राउज़र के नाम के साथ HTML में CSS क्लास जोड़ता है।


क्या आपने आईओएस पर क्रोम का परीक्षण किया?
विक

8

कोई विचार नहीं अगर यह किसी के लिए उपयोगी है, लेकिन यहाँ टाइपस्क्रिप्ट को खुश करने के लिए एक संस्करण है।

export function getBrowser() {

// Opera 8.0+
if ((!!window["opr"] && !!["opr"]["addons"]) || !!window["opera"] || navigator.userAgent.indexOf(' OPR/') >= 0) {
    return 'opera';
}

// Firefox 1.0+
if (typeof window["InstallTrigger"] !== 'undefined') {
    return 'firefox';
}

// Safari 3.0+ "[object HTMLElementConstructor]" 
if (/constructor/i.test(window["HTMLElement"]) || (function(p) { return p.toString() === "[object SafariRemoteNotification]"; })(!window['safari'] || (typeof window["safari"] !== 'undefined' && window["safari"].pushNotification))) {
    return 'safari';
}

// Internet Explorer 6-11
if (/*@cc_on!@*/false || !!document["documentMode"]) {
    return 'ie';
}

// Edge 20+
if (!(/*@cc_on!@*/false || !!document["documentMode"]) && !!window["StyleMedia"]) {
    return 'edge';
}

// Chrome 1+
if (!!window["chrome"] && !!window["chrome"].webstore) {
    return 'chrome';
}

// Blink engine detection
if (((!!window["chrome"] && !!window["chrome"].webstore) || ((!!window["opr"] && !!["opr"]["addons"]) || !!window["opera"] || navigator.userAgent.indexOf(' OPR/') >= 0)) && !!window["CSS"]) {
    return 'blink';
}

}


एक शर्त के रूप में आपके पास कुछ "झूठे" क्यों हैं?
योनातन नीर

@YonatanNir मुझे लगता है कि यह सशर्त संकलन का पता लगाने के लिए है: developer.mozilla.org/en-US/docs/Web/JavaScript/…
Lucas Azevedo

5

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

मैंने @nimesh कोड में कुछ बदलाव किए हैं अब यह एज के लिए भी काम कर रहा है, और ओपेरा मुद्दा तय हो गया है:

function getBrowserName() {

    if ( navigator.userAgent.indexOf("Edge") > -1 && navigator.appVersion.indexOf('Edge') > -1 ) {
        return 'Edge';
    }
    else if( navigator.userAgent.indexOf("Opera") != -1 || navigator.userAgent.indexOf('OPR') != -1 )
    {
        return 'Opera';
    }
    else if( navigator.userAgent.indexOf("Chrome") != -1 )
    {
        return 'Chrome';
    }
    else if( navigator.userAgent.indexOf("Safari") != -1)
    {
        return 'Safari';
    }
    else if( navigator.userAgent.indexOf("Firefox") != -1 ) 
    {
        return 'Firefox';
    }
    else if( ( navigator.userAgent.indexOf("MSIE") != -1 ) || (!!document.documentMode == true ) ) //IF IE > 10
    {
        return 'IE';
    }  
    else 
    {
        return 'unknown';
    }
}

धन्यवाद @nimesh उपयोगकर्ता: 2063564


4

एक कम "हैकी" विधि भी है जो सभी लोकप्रिय ब्राउज़रों के लिए काम करती है। Google ने अपनी क्लोजर लाइब्रेरी में एक ब्राउज़र-चेक शामिल किया है । विशेष रूप से, पर एक नज़र है goog.userAgentऔर goog.userAgent.product। इस तरह, आप भी अद्यतित हैं यदि ब्राउज़र अपने आप को प्रस्तुत करने के तरीके में कुछ बदलता है (यह देखते हुए कि आप हमेशा क्लोजर कंपाइलर का नवीनतम संस्करण चलाते हैं।)


यहां अधिकांश जवाब "हैकी" होने से चिंतित नहीं हैं यदि वे एकमात्र विश्वसनीय विधि हैं। userAgent, जैसा कि कई बार उल्लेख किया गया है, आसानी से खराब हो गया है, और इसलिए अविश्वसनीय है।
होल्डऑफहुंगर

4

यदि आपको यह जानने की आवश्यकता है कि कुछ विशेष ब्राउज़र का संख्यात्मक संस्करण क्या है तो आप निम्न स्निपेट का उपयोग कर सकते हैं। वर्तमान में यह आपको क्रोम / क्रोमियम / फ़ायरफ़ॉक्स का संस्करण बताएगा:

var match = $window.navigator.userAgent.match(/(?:Chrom(?:e|ium)|Firefox)\/([0-9]+)\./);
var ver = match ? parseInt(match[1], 10) : 0;

2

UAParser ब्राउज़र, इंजन, OS, CPU और डिवाइस प्रकार / मॉडल को userAgent string से पहचानने के लिए हल्के जावास्क्रिप्ट लाइब्रेरी में से एक है।

वहाँ एक CDN उपलब्ध है। यहां, मैंने UAParser का उपयोग करके ब्राउज़र का पता लगाने के लिए एक उदाहरण कोड शामिल किया है।

<!doctype html>
<html>
<head>
<script src="https://cdn.jsdelivr.net/npm/ua-parser-js@0/dist/ua-parser.min.js"></script>
<script type="text/javascript">
    var parser = new UAParser();
    var result = parser.getResult();
    console.log(result.browser);     // {name: "Chromium", version: "15.0.874.106"}
</script>
</head>
<body>
</body>
</html>

अब आप result.browserसशर्त रूप से अपने पेज को प्रोग्राम करने के लिए मूल्य का उपयोग कर सकते हैं ।

स्रोत ट्यूटोरियल: जावास्क्रिप्ट का उपयोग करके ब्राउज़र, इंजन, ओएस, सीपीयू और डिवाइस का पता कैसे लगाएं?


3
कोड की एक हजार लाइनों आप हल्के कहते हैं?
deathangel908

1
var BrowserDetect = {
        init: function () {
            this.browser = this.searchString(this.dataBrowser) || "Other";
            this.version = this.searchVersion(navigator.userAgent) || this.searchVersion(navigator.appVersion) || "Unknown";
        },
        searchString: function (data) {
            for (var i = 0; i < data.length; i++) {
                var dataString = data[i].string;
                this.versionSearchString = data[i].subString;

                if (dataString.indexOf(data[i].subString) !== -1) {
                    return data[i].identity;
                }
            }
        },
        searchVersion: function (dataString) {
            var index = dataString.indexOf(this.versionSearchString);
            if (index === -1) {
                return;
            }

            var rv = dataString.indexOf("rv:");
            if (this.versionSearchString === "Trident" && rv !== -1) {
                return parseFloat(dataString.substring(rv + 3));
            } else {
                return parseFloat(dataString.substring(index + this.versionSearchString.length + 1));
            }
        },

        dataBrowser: [
            {string: navigator.userAgent, subString: "Edge", identity: "MS Edge"},
            {string: navigator.userAgent, subString: "MSIE", identity: "Explorer"},
            {string: navigator.userAgent, subString: "Trident", identity: "Explorer"},
            {string: navigator.userAgent, subString: "Firefox", identity: "Firefox"},
            {string: navigator.userAgent, subString: "Opera", identity: "Opera"},  
            {string: navigator.userAgent, subString: "OPR", identity: "Opera"},  

            {string: navigator.userAgent, subString: "Chrome", identity: "Chrome"}, 
            {string: navigator.userAgent, subString: "Safari", identity: "Safari"}       
        ]
    };

    BrowserDetect.init();


    var bv= BrowserDetect.browser;
    if( bv == "Chrome"){
        $("body").addClass("chrome");
    }
    else if(bv == "MS Edge"){
     $("body").addClass("edge");
    }
    else if(bv == "Explorer"){
     $("body").addClass("ie");
    }
    else if(bv == "Firefox"){
     $("body").addClass("Firefox");
    }


$(".relative").click(function(){
$(".oc").toggle('slide', { direction: 'left', mode: 'show' }, 500);
$(".oc1").css({
   'width' : '100%',
   'margin-left' : '0px',
   });
});

0

यह 2016 के लिए Rob के मूल उत्तर और Pilau के अपडेट दोनों को मिलाता है

    var isOpera = !!window.opera || navigator.userAgent.indexOf(' OPR/') >= 0;
    // Opera 8.0+ (UA detection to detect Blink/v8-powered Opera)
var isFirefox = typeof InstallTrigger !== 'undefined';   // Firefox 1.0+
var isSafari = Object.prototype.toString.call(window.HTMLElement).indexOf('Constructor') > 0;
    // At least Safari 3+: "[object HTMLElementConstructor]"
var isChrome = !!window.chrome && !isOpera;              // Chrome 1+
var isIE = /*@cc_on!@*/false || !!document.documentMode;
// Edge 20+
var isEdge = !isIE && !!window.StyleMedia;
// Chrome 1+
var output = 'Detecting browsers by ducktyping:<hr>';
output += 'isFirefox: ' + isFirefox + '<br>';
output += 'isChrome: ' + isChrome + '<br>';
output += 'isSafari: ' + isSafari + '<br>';
output += 'isOpera: ' + isOpera + '<br>';
output += 'isIE: ' + isIE + '<br>';
output += 'isIE Edge: ' + isEdge + '<br>';
document.body.innerHTML = output;

क्या उपयोगकर्ता को यह बताने का कोई बिंदु है कि वे किस ब्राउज़र का उपयोग कर रहे हैं? मुझे लगता है कि वे पहले से ही यह जानते हैं।
होल्डऑफ हंगलर

1
@HoldOffHunger यह मुख्य इरादा सक्रिय ब्राउज़र के लिए सबसे अधिक संगत कोड को अनुकूलित करने के लिए अधिक था, बजाय उस उपयोगकर्ता को सूचित करने के जो ब्राउज़र का उपयोग कर रहे हैं। जब तक वे जिस ब्राउज़र का उपयोग कर रहे हैं वह सुपर आउटडेटेड है और उसे बैकवॉर्स संगतता से बाहर रखा गया है, जिसमें उपयोगकर्ता को यह बताने में दुख नहीं होगा कि वे एक बेहतर अनुभव से लाभ उठा सकते हैं, तो उन्हें कुछ और तारीख तक स्विच करना चाहिए
जो बोर्ग

0

यहां आपको पता चलता है कि यह कौन सा ब्राउज़र चल रहा है।

function isValidBrowser(navigator){

            var isChrome =  navigator.indexOf('chrome'),
            isFireFox= navigator.indexOf('firefox'),
            isIE = navigator.indexOf('trident') ,
            isValidChromeVer = parseInt(navigator.substring(isChrome+7, isChrome+8)) >= 4,
            isValidFireForVer = parseInt(navigator.substring(isFireFox+8, isFireFox+9)) >= 3,
            isValidIEVer = parseInt(navigator.substring(isIE+8, isIE+9)) >= 7;

            if((isChrome > -1 && isValidChromeVer){ console.log("Chrome Browser")}

            if(isFireFox > -1 && isValidFireForVer){ console.log("FireFox  Browser")}

            if(isIE > -1 && isValidIEVer)){ console.log("IE Browser")}


        }

0

हम नीचे उपयोग विधियों का उपयोग कर सकते हैं

utils.isIE = function () {
        var ver = navigator.userAgent;
        return ver.indexOf("MSIE") !== -1 || ver.indexOf("Trident") !== -1; // need to check for Trident for IE11
    };

    utils.isIE32 = function () {
        return (utils.isIE() && navigator.appVersion.indexOf('Win64') === -1);
    };

    utils.isChrome = function () {
        return (window.chrome);
    };

    utils.isFF64 = function () {
        var agent = navigator.userAgent;
        return (agent.indexOf('Win64') >= 0 && agent.indexOf('Firefox') >= 0);
    };

    utils.isFirefox = function () {
        return (navigator.userAgent.toLowerCase().indexOf('firefox') > -1);
    };

0
const isChrome = /Chrome/.test(navigator.userAgent)
const isFirefox = /Firefox/.test(navigator.userAgent)

दुर्भाग्य से, यह एक अच्छा जवाब नहीं है। अपने उपयोगकर्ता संदेश में एज में Chrome है। इसका उपयोग करना बेहतर है !! window.chrome && (!! window.chrome.webstore || !! window.chrome.runtor)!
प्रेजेमो

-3

जावास्क्रिप्ट कोड की सरल, सिंगल लाइन आपको ब्राउज़र का नाम देगी:

function GetBrowser()
{
    return  navigator ? navigator.userAgent.toLowerCase() : "other";
}

16
अकेले userAgent हमें पर्याप्त नहीं बताता है। उदाहरण के लिए, मेरा उपयोगकर्ता एजेंट "मोज़िला / 5.0 (Macintosh; Intel Mac OS X 10_10_4) AppleWebKit / 537.36 (KHTML, जैसे गेको) Chrome / 45.0.2454.85 Safari (537.36) है, जिसमें मोज़िला, क्रोम और सफारी का उल्लेख है। मैं कौन सा ब्राउज़र टाइप कर रहा हूँ?
eremzeit

क्षमा करें, लेकिन मैं आपको "कौन सा ब्राउज़र प्रकार हूं?" आप क्या पाना चाहते हैं?
नीरव मेहता

1
@NiravMehta उसका मतलब यह है navigator.userAgentकि आपके पास हर संभव ब्राउज़र बताता है। इसलिए यह वास्तव में विश्वसनीय नहीं है, केवल यह मामला काम करेगा यदि उपयोगकर्ता के पास केवल एक ब्राउज़र है।
बाल्ड्रनी

1
यह ब्राउज़र का पता लगाने का एक विश्वसनीय तरीका नहीं है। कुछ यूज़रैगेंट्स में क्रोम और सफारी दोनों शामिल हैं, इसलिए यह पता लगाने का कोई तरीका नहीं है कि हमें किस पर विचार करना चाहिए और अंतिम लेकिन, कम से कम नहीं, उपयोगकर्ता पेज द्वारा संशोधित किया जा सकता है।
जुवेनाइक
हमारी साइट का प्रयोग करके, आप स्वीकार करते हैं कि आपने हमारी Cookie Policy और निजता नीति को पढ़ और समझा लिया है।
Licensed under cc by-sa 3.0 with attribution required.