सफारी ब्राउज़र का पता लगाएं


142

जावास्क्रिप्ट का उपयोग करके सफारी ब्राउज़र का पता कैसे लगाएं? मैंने नीचे कोड की कोशिश की है और यह न केवल सफारी बल्कि क्रोम ब्राउज़र का भी पता लगाता है।

function IsSafari() {

  var is_safari = navigator.userAgent.toLowerCase().indexOf('safari/') > -1;
  return is_safari;

}

1
क्रोम के ठीक काम के लिए, जेएस कोड फाइल से संबंधित कुछ सफ़ारी के लिए सुरक्षित रूप से काम करता है।
टॉमस

1
एपीआई में जो भी अंतर हैं, उनके लिए आपको लगभग निश्चित रूप से परीक्षण करना चाहिए। सफारी और क्रोम से परे अन्य WebKit आधारित ब्राउज़र हैं।
क्वेंटिन

12
कई कारण हैं जो एक ब्राउज़र का पता लगाने की इच्छा कर सकते हैं। उदाहरण के लिए, इस लेखन के रूप में एसवीजी इंजन के कुछ पहलू जैसे कि फिल्टर सफारी में टूट गए हैं, लेकिन क्रोम में काम कर रहे हैं।
पॉल लेगाटो

कभी-कभी आप बग को ठीक नहीं कर सकते क्योंकि आप इसे पुन: उत्पन्न नहीं कर सकते हैं (मेरे पास मैक तक पहुंच नहीं है)। मैंने Midori (कुछ BlobBuilder / SendbBinary shim के लिए Blob समस्या) पर समस्या तय की, लेकिन क्लाइंट का कहना है कि फ़ाइल अपलोड के साथ अभी भी एक समस्या है, इसलिए सबसे अच्छी बात मैं सिर्फ यह सोच सकता हूं कि सफारी का समर्थन हटा दिया जाए और इसके लिए iframes का उपयोग किया जाए (जैसा कि) पुराना IE)
लंबर

जवाबों:


110

क्रोम को फ़िल्टर करने के लिए आप आसानी से क्रोम के सूचकांक का उपयोग कर सकते हैं:

var ua = navigator.userAgent.toLowerCase(); 
if (ua.indexOf('safari') != -1) { 
  if (ua.indexOf('chrome') > -1) {
    alert("1") // Chrome
  } else {
    alert("2") // Safari
  }
}

6
काम नहीं करता है। वर्तमान में iPhone पर क्रोम UA स्ट्रिंग आउटपुट कर रहा है और इसमें "क्रोम" शब्द भी नहीं है।
पॉल कार्लटन

5
विंडोज 10 में IE 11 UA स्ट्रिंग में सफारी और क्रोम
cuixiping

ब्लैकबेरी में "सफारी" भी शामिल है।
हैरी पेकोनेंन

18
@ फाल्म ब्राउज़र का पता लगाने के लिए कई वैध उपयोग के मामले हैं। पूछने वाले या उत्तर देने वाले की मंशा जानने के लिए अनुमान न करें। हालांकि यह एक उपयोगी टिप को शामिल करने के लिए बहुत अच्छा है जिसे आप प्रासंगिक मान सकते हैं, यह किसी भी तरह से आवश्यकता नहीं है।
रुबेन मार्टिनेज जूनियर

1
यह एंड्रॉइड ब्राउज़रों पर काम नहीं करता है, जिसमें "सफारी" शामिल है, लेकिन "क्रोम" नहीं: डेवलपर्स
एरिक एंड्रयू लुईस

156

ध्यान दें: हमेशा उस विशिष्ट व्यवहार का पता लगाने का प्रयास करें जिसे आप ठीक करने का प्रयास कर रहे हैं, इसके बजाय उसे लक्षित करने के बजायisSafari?

अंतिम उपाय के रूप में, इस रेगेक्स के साथ सफारी का पता लगाएं:

var isSafari = /^((?!chrome|android).)*safari/i.test(navigator.userAgent);

यह निगेटिव लुक-अराउंड का उपयोग करता है और यह क्रोम, एज और सभी एंड्रॉइड ब्राउजर को शामिल करता है Safariजो उनके यूजर एजेंट में नाम शामिल करता है ।


2
यह काम नहीं करता है। अगर मैं एक iPhone पर क्रोम ब्राउज़र का उपयोग कर रहा हूं, तो मैं अभी भी सच हो रहा हूं।
ayjay

27
ऐसा इसलिए है क्योंकि क्रोम सहित iOS के सभी ब्राउज़र सिर्फ सफारी के लिए रैपर ( मिनी मोड में ओपेरा मिनी के अपवाद के साथ ) हैं। यह जरूरी नहीं है कि वे सभी इस परीक्षण से मेल खाएंगे क्योंकि उपयोगकर्ता के स्ट्रिंग स्ट्रिंग के ऊपर है। आप अलग से iOS पर Chrome का पता लगाना चाह सकते हैं ।
शाम

यार यह मेरे लिए काम किया !!! धन्यवाद a ton .. navigator.userAgent "5.0 (विंडोज NT 6.1) AppleWebKit / 537.36 (KHTML, जैसे गेको) Chrome / 39.0.2171.99 Safari / 537.36" जैसे मान लौटा रहा था। मैक में Windows और Safari दोनों में।
KaustubhSV

2
अब तय हो गया। आप निश्चित रूप से सही हैं, बहुत सारे ब्राउज़रों के साथ समस्या यह है कि उन्हें अन्य नामों में शामिल किया गया है ताकि वे इसे न छोड़ें। जैसे एज में यूए में क्रोम और सफारी दोनों शामिल हैं। उपयोगकर्ता एजेंट चेक इस कारण खराब हैं: ब्राउज़र बदलते हैं और चेक को अपडेट करने की आवश्यकता होती है। दुर्भाग्य से एक ब्राउज़र का पता लगाने का कोई सही तरीका नहीं है, यह हमेशा एक अनुमान है।
फ्रीजेंट

1
निश्चित रूप से फीचर डिटेक्शन का उपयोग करने के लिए एक अच्छा विचार है, लेकिन कुछ व्यवहार परीक्षण के लिए कठिन या लगभग असंभव हैं, उदाहरण के लिए कि क्या मोबाइल पर वीडियो स्वचालित रूप से फुलस्क्रीन जाते हैं, कुछ ऐसा जो केवल iPhone और iPod पर होता है। इसका परीक्षण करने के लिए, आपको एक वीडियो लोड करना होगा और उपयोगकर्ता को इसे खेलना होगा।
फ्रीगर्ल

91

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

यदि आप अभी भी इसे करना चाहते हैं और किसी भी सफारी संस्करण के लिए परीक्षण करना चाहते हैं, तो मैं इसका उपयोग करने का सुझाव दूंगा

var isSafari = navigator.vendor && navigator.vendor.indexOf('Apple') > -1 &&
               navigator.userAgent &&
               navigator.userAgent.indexOf('CriOS') == -1 &&
               navigator.userAgent.indexOf('FxiOS') == -1;

यह सभी उपकरणों पर सफारी के किसी भी संस्करण के साथ काम करेगा: मैक, आईफोन, आईपॉड, आईपैड।

संपादित करें

अपने वर्तमान ब्राउज़र में परीक्षण करने के लिए: https://jsfiddle.net/j5hgcbm2/

संपादित करें २

सही ढंग से iOS पर Chrome का पता लगाने के लिए क्रोम डॉक्स के अनुसार अपडेट किया गया

यह ध्यान देने योग्य है कि आईओएस पर सभी ब्राउजर सफारी के लिए सिर्फ रैपर हैं और एक ही इंजन का उपयोग करते हैं। इस धागे में अपने स्वयं के उत्तर पर bfred.it की टिप्पणी देखें।

संपादित करें 3

आईओएस पर फ़ायरफ़ॉक्स का सही तरीके से पता लगाने के लिए फ़ायरफ़ॉक्स डॉक्स के अनुसार अपडेट किया गया


टिप्पणी के लिए धन्यवाद - आईओएस पर क्रोम का सही तरीके से पता लगाने के लिए अपडेट किया गया है
क्विंग

@qingu - मैं इस जावास्क्रिप्ट को समझ नहीं पा रहा हूं, मैं कुछ ऐसा कैसे करूंगा - अगर (सफारीब्रोसर) {यह करें} {और करें {उसी कोड का उपयोग करते हुए जो मान is var isSafari ’है धन्यवाद
GAV

@GAV: isSafariहो जाएगा trueएक सफ़ारी ब्राउज़र में, falseअन्यथा। आप बस उपरोक्त स्निपेट का उपयोग कर सकते हैं और फिर इसे पोस्ट करते ही आपका लगभग उपयोग कर सकते हैं। if (isSafari) { do_this(); } else { do_that(); }
19

2
दुर्भाग्य से और अधिक कारण हैं कि केवल फीचर डिटेक्शन की तुलना में ब्राउज़र को जानने की कोशिश करना। एक ब्राउज़र एक सुविधा का समर्थन कर सकता है, लेकिन छोटी गाड़ी हो (उदाहरण: IE10 में कैनवास बग, लेकिन IE9 में वही सुविधा काम करती है)। इसके अलावा फ़ायरफ़ॉक्स वेबकिट आधारित ब्राउज़रों की तुलना में अलग तरह से व्यवहार करता है, जैसे कि यह माउस मूवमेंट पर कैसे प्रतिक्रिया देता है। Apple के सफ़ारी में रिफ्लक्स बग हैं जो क्रोम में मौजूद नहीं हैं। कुछ ब्राउज़र्स भी प्रदर्शन करते हैं जब दूसरों की तुलना में कुछ कम्प्यूटेशनल रूप से गहन कार्य करते हैं।
डेमीइम्प

2
@ फ़ायरफ़ॉक्स के लिए आप && !navigator.userAgent.match('FxiOS')क्रोम चेक के समान जोड़ सकते हैं - Ref ( developer.mozilla.org/en-US/docs/Web/HTTP/Headers/User-Agent/… )
पेट्री पेलिनेन

60

महज प्रयोग करें:

var isSafari = window.safari !== undefined;
if (isSafari) console.log("Safari, yeah!");

15
निश्चित नहीं है कि यह उच्च क्यों नहीं है - क्या यह सही, छोटा और सरल है। मुझे अभाव के लिए डेस्कटॉप सफारी को नियंत्रित करने की आवश्यकता थी getUserMedia
स्टीफन टेट्रौल्ट

3
यह डेस्कटॉप सफारी निर्धारित करने का सही तरीका है क्योंकि यह मोबाइल पर काम नहीं करता है
Godblessstrawberry

सफारी के कौन से संस्करण इसके लिए काम करते हैं? V5.1.7 के लिए काम नहीं कर रहा है
इलियटशैमेल 4

यदि आप केवल ब्राउज़र के बारे में परवाह करते हैं, और मोबाइल बनाम डेस्कटॉप नहीं, तो यह पूरी तरह से काम करता है।
एंटुआन

1
यह iPhone 11 प्रो मैक्स सिम्युलेटर 13.5 के अंदर काम नहीं किया
ईसाई वैलेंटाइन

19

इस कोड का उपयोग केवल सफारी ब्राउज़र का पता लगाने के लिए किया जाता है

if (navigator.userAgent.search("Safari") >= 0 && navigator.userAgent.search("Chrome") < 0) 
{
   alert("Browser is Safari");          
}

4
यह कोड केवल यह पता लगाता है कि वेबकिट ब्राउज़र क्रोम नहीं है। कई अन्य ब्राउज़रों को अपने उपयोगकर्ता एजेंट स्ट्रिंग में "सफारी" को शामिल करने का बुरा विचार है। उदाहरण के लिए, ओपेरा: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_6_8) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/37.0.2062.94 Safari/537.36 OPR/24.0.1558.51 (Edition Next)या स्टॉक एंड्रॉइड ब्राउज़र:Mozilla/5.0 (X11; Linux x86_64) AppleWebKit/534.24 (KHTML, like Gecko) Chrome/11.0.696.34 Safari/534.24
नष्ट कर देता है

प्लेटफ़ॉर्म डिटेक्शन टॉसिंग संभवतः विशिष्ट संगतता मामलों को फ़िल्टर कर सकता है।
ljgww

मैंने अभी एक आधा दर्जन थर्ड पार्टी आईओएस ब्राउज़र की जाँच की है, वे सभी बहुत ही सटीक सफारी यूजर-एजेंट को खराब करते हैं।
मिच मैच

तो यह केवल क्रोम का पता लगाएगा। और फिर भी, मुझे अभी पता चला है कि क्रोम 44 में अब UA में Chrome नहीं है, लेकिन 'CriOS' के बजाय :(
मिच मैच

हमें हमेशा फीचर डिटेक्शन करने की कोशिश करनी चाहिए, और अंतिम बार रिसोर्ट के रूप में ब्राउजर डिटेक्शन का उपयोग करना चाहिए, क्योंकि बाद वाले को वैध उपयोगकर्ताओं को तोड़ने और ब्लॉक करने की अधिक संभावना होती है। किसी भी उत्तर में जो फीचर डिटेक्शन का उल्लेख नहीं करता है, वह मुझसे कम हो रहा है।
फ्लिम्म

12

क्योंकि क्रोम और सफारी के लिए यूजरएजेंट लगभग समान हैं, यह ब्राउज़र के विक्रेता को देखने में आसान हो सकता है

सफारी

navigator.vendor ==  "Apple Computer, Inc."

क्रोम

navigator.vendor ==  "Google Inc."

फ़ायर्फ़ॉक्स (यह खाली क्यों है?)

navigator.vendor ==  ""

IE (यह अपरिभाषित क्यों है?)

navigator.vendor ==  undefined

1
मैं विभिन्न कंप्यूटरों (मैक डेस्कटॉप, आईपैड, आदि) पर काम पर चेतावनी संदेशों को निष्क्रिय करने के लिए कुछ ढूंढ रहा था, और पूरी तरह से काम किया।
dylnmc

लेकिन iOS पर क्रोम के लिए विक्रेता भी "Apple Computer, Inc." होगा। क्षमा करें ...
पायोत्र कोवल्स्की

@PiotrKowalski - आप किस समाधान के साथ गए थे?
टायलरलिंडेल

@tylerlindell इस पृष्ठ के नीचे "संस्करण" शब्द के साथ मेरा उत्तर देखें।
पिओटर कोवल्स्की

7

केवल सफारी क्रोम whitout:

दूसरों के कोड की कोशिश करने के बाद मुझे कोई भी ऐसा नहीं मिला जो सफारी के नए और पुराने संस्करणों के साथ काम करता हो।

अंत में, मैंने यह कोड किया जो मेरे लिए बहुत अच्छा काम कर रहा है:

var ua = navigator.userAgent.toLowerCase(); 
var isSafari = false;
try {
  isSafari = /constructor/i.test(window.HTMLElement) || (function (p) { return p.toString() === "[object SafariRemoteNotification]"; })(!window['safari'] || safari.pushNotification);
}
catch(err) {}
isSafari = (isSafari || ((ua.indexOf('safari') != -1)&& (!(ua.indexOf('chrome')!= -1) && (ua.indexOf('version/')!= -1))));

//test
if (isSafari)
{
  //Code for Safari Browser (Desktop and Mobile)
  document.getElementById('idbody').innerHTML = "This is Safari!";
}
else
{
  document.getElementById('idbody').innerHTML = "Not is Safari!";
}
<body id="idbody">
</body>



5

मुझे नहीं पता कि ओपी सफारी का पता लगाना क्यों चाहता था, लेकिन दुर्लभ स्थिति में आपको ब्राउज़र को सूँघने की आवश्यकता है आजकल ब्राउज़र के नाम की तुलना में रेंडर इंजन का पता लगाना अधिक महत्वपूर्ण है। IOS पर उदाहरण के लिए सभी ब्राउज़र सफारी / वेबकिट इंजन का उपयोग करते हैं, इसलिए यदि अंतर्निहित रेंडरर सफारी / वेबकिट में है तो "क्रोम" या "फ़ायरफ़ॉक्स" ब्राउज़र नाम के रूप में प्राप्त करना व्यर्थ है। मैंने पुराने ब्राउज़र के साथ इस कोड का परीक्षण नहीं किया है, लेकिन यह एंड्रॉइड, आईओएस, ओएस एक्स, विंडोज और लिनक्स पर हाल ही में सब कुछ के साथ काम करता है।

<script>
    let browserName = "";

    if(navigator.vendor.match(/google/i)) {
        browserName = 'chrome/blink';
    }
    else if(navigator.vendor.match(/apple/i)) {
        browserName = 'safari/webkit';
    }
    else if(navigator.userAgent.match(/firefox\//i)) {
        browserName = 'firefox/gecko';
    }
    else if(navigator.userAgent.match(/edge\//i)) {
        browserName = 'edge/edgehtml';
    }
    else if(navigator.userAgent.match(/trident\//i)) {
        browserName = 'ie/trident';
    }
    else
    {
        browserName = navigator.userAgent + "\n" + navigator.vendor;
    }
    alert(browserName);
</script>

स्पष्टीकरण देना:

  • IOS के अंतर्गत सभी ब्राउज़रों को "सफारी / वेबकिट" के रूप में रिपोर्ट किया जाएगा
  • एंड्रॉइड के तहत सभी ब्राउज़र लेकिन फ़ायरफ़ॉक्स को "क्रोम / ब्लिंक" के रूप में रिपोर्ट किया जाएगा
  • Chrome, Opera, Blisk, Vivaldi आदि सभी को Windows, OS X या CPU के तहत "क्रोम / ब्लिंक" के रूप में सूचित किया जाएगा।

4

मैं इसका उपयोग करता हूं

function getBrowserName() {
    var name = "Unknown";
    if(navigator.userAgent.indexOf("MSIE")!=-1){
        name = "MSIE";
    }
    else if(navigator.userAgent.indexOf("Firefox")!=-1){
        name = "Firefox";
    }
    else if(navigator.userAgent.indexOf("Opera")!=-1){
        name = "Opera";
    }
    else if(navigator.userAgent.indexOf("Chrome") != -1){
        name = "Chrome";
    }
    else if(navigator.userAgent.indexOf("Safari")!=-1){
        name = "Safari";
    }
    return name;   
}

if( getBrowserName() == "Safari" ){
    alert("You are using Safari");
}else{
    alert("You are surfing on " + getBrowserName(name));
}

4

सबसे सरल उत्तर:

function isSafari() {
 if (navigator.vendor.match(/[Aa]+pple/g).length > 0 ) 
   return true; 
 return false;
}

2
यह काम करता है, हालांकि regexp के बिना सरल किया जा सकता है:navigator.vendor.toLowerCase().indexOf('apple') > -1
fviktor

5
और भी आसान ... if (navigator.vendor.match(/apple/i)) { ... }
ब्रैड

यह फ़ायरफ़ॉक्स पर ios 13.3.1 के लिए काम नहीं करता है क्योंकि यह Apple कंप्यूटर को दिखाता है, inc
Nuttynibbles

1
@nuttynibbles: यह शायद आप चाहते हैं क्योंकि iOS पर हर ब्राउज़र भेस में एक सफारी है।
11

3

अभिलेखों के लिए, सबसे सुरक्षित तरीका जो मैंने पाया है वह इस उत्तर से ब्राउज़र-डिटेक्शन कोड के सफारी भाग को लागू करना है :

const isSafari = window['safari'] && safari.pushNotification &&
    safari.pushNotification.toString() === '[object SafariRemoteNotification]';

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


1
यह iPhone OS 13_4_1 पर सफारी संस्करण / 13.1 मोबाइल / 15E148 सफारी / 604.1 के साथ काम नहीं करता है।
माइंडो

2

मुझे पता है कि यह प्रश्न पुराना है, लेकिन मैंने उत्तर को वैसे भी पोस्ट करने के बारे में सोचा क्योंकि यह किसी की मदद कर सकता है। उपरोक्त समाधान कुछ किनारे के मामलों में विफल हो रहे थे, इसलिए हमें इसे एक तरह से लागू करना था जो आईओएस, डेस्कटॉप और अन्य प्लेटफार्मों को अलग से संभालता है।

function isSafari() {
    var ua = window.navigator.userAgent;
    var iOS = !!ua.match(/iP(ad|od|hone)/i);
    var hasSafariInUa = !!ua.match(/Safari/i);
    var noOtherBrowsersInUa = !ua.match(/Chrome|CriOS|OPiOS|mercury|FxiOS|Firefox/i)
    var result = false;
    if(iOS) { //detecting Safari in IOS mobile browsers
        var webkit = !!ua.match(/WebKit/i);
        result = webkit && hasSafariInUa && noOtherBrowsersInUa
    } else if(window.safari !== undefined){ //detecting Safari in Desktop Browsers
        result = true;
    } else { // detecting Safari in other platforms
        result = hasSafariInUa && noOtherBrowsersInUa
    }
    return result;
}


1

यह अनूठा "मुद्दा" 100% संकेत है कि ब्राउज़र सफारी है (यह विश्वास करें या नहीं)।

if (Object.getOwnPropertyDescriptor(Document.prototype, 'cookie').descriptor === false) {
   console.log('Hello Safari!');
}

इसका मतलब है कि कुकी ऑब्जेक्ट डिस्क्रिप्टर सफारी पर झूठे के लिए सेट है, जबकि अन्य सभी सही है, जो वास्तव में मुझे दूसरे प्रोजेक्ट पर सिरदर्द दे रहा है। हैप्पी कोडिंग!


अब सच नहीं लगता। इसके अलावा फ़ायरफ़ॉक्स "Object.getOwnPropertyDescriptor (...) अपरिभाषित है" पर दुर्घटनाग्रस्त हो जाता है
Offirmo

0

शायद यह काम करता है:

Object.prototype.toString.call(window.HTMLElement).indexOf('Constructor')

संपादित करें: कोई लंबा काम


वास्तव में यह क्या कर रहा है, क्योंकि सभी ब्राउज़रों पर -1 लौटें?
Petroff

@Petroff अब नई सफारी में काम नहीं कर रहा है। इस पर ध्यान दिलाने के लिए धन्यवाद।
हर्षल बढ़ई

2
उत्तर को हटाने के लिए स्वतंत्र महसूस करें।
फ्लिम

0

मैं एक फ़ंक्शन बनाता हूं जो बूलियन प्रकार लौटाता है:

export const isSafari = () => navigator.userAgent.toLowerCase().indexOf('safari') !== -1

-2

उपयोगकर्ता एजेंट सूँघना वास्तव में मुश्किल और अविश्वसनीय है। हम iOS पर सफारी का पता लगाने की कोशिश कर रहे थे, जैसे @ qingu का जवाब ऊपर, इसने सफारी, क्रोम और फ़ायरफ़ॉक्स के लिए बहुत अच्छा काम किया। लेकिन इसने ओपेरा और एज को सफारी के रूप में गलत तरीके से पहचान लिया।

इसलिए हम फीचर डिटेक्शन के साथ गए, जैसा कि यह आज की तरह दिखता है, serviceWorkerकेवल सफारी में समर्थित है और आईओएस पर किसी अन्य ब्राउज़र में नहीं। जैसा कि https://jakearchibald.github.io/isserviceworkerready/ में बताया गया है

समर्थन में उस प्लेटफ़ॉर्म पर तृतीय-पक्ष ब्राउज़र के iOS संस्करण शामिल नहीं हैं (सफारी समर्थन देखें)।

तो हमने कुछ ऐसा किया

if ('serviceWorker' in navigator) {
    return 'Safari';
}
else {
    return 'Other Browser';
}

नोट : मैकओएस पर सफारी पर परीक्षण नहीं किया गया।

हमारी साइट का प्रयोग करके, आप स्वीकार करते हैं कि आपने हमारी Cookie Policy और निजता नीति को पढ़ और समझा लिया है।
Licensed under cc by-sa 3.0 with attribution required.