जावास्क्रिप्ट के माध्यम से ipad / iphone वेबव्यू का पता लगाएं

Question 1

अगर वेबसाइट ipad सफारी के अंदर या अनुप्रयोग WebView के अंदर चलती है, तो क्या जावास्क्रिप्ट के माध्यम से अंतर करने का एक तरीका है?

Question 2

इस का एक संयोजन का उपयोग करता है window.navigator.userAgentऔर window.navigator.standalone। यह एक iOS वेब ऐप से संबंधित सभी चार राज्यों में अंतर कर सकता है: सफारी (ब्राउज़र), स्टैंडअलोन (फुलस्क्रीन), uiwebview, और iOS नहीं।

डेमो: http://jsfiddle.net/ThinkingStiff/6qrbn/

var standalone = window.navigator.standalone,
    userAgent = window.navigator.userAgent.toLowerCase(),
    safari = /safari/.test( userAgent ),
    ios = /iphone|ipod|ipad/.test( userAgent );

if( ios ) {
    if ( !standalone && safari ) {
        //browser
    } else if ( standalone && !safari ) {
        //standalone
    } else if ( !standalone && !safari ) {
        //uiwebview
    };
} else {
    //not iOS
};

Question 3

उपयोगकर्ता एजेंट

UIWebView में चल रहा है

Mozilla/5.0 (iPad; CPU OS 5_1 like Mac OS X) AppleWebKit/534.46 (KHTML, like Gecko) Mobile/98176

आईपैड पर सफारी में चल रहा है

Mozilla/5.0 (iPad; CPU OS 5_1 like Mac OS X) AppleWebKit/534.46 (KHTML, like Gecko) Version/5.1 Mobile/9B176 Safari/7534.48.3

मैक ओएस एक्स पर सफारी में चल रहा है

Mozilla/5.0 (Macintosh; Intel Mac OS X 10_7_3) AppleWebKit/534.55.3 (KHTML, like Gecko) Version/5.1.5 Safari/534.55.3

मैक ओएस एक्स पर क्रोम में चल रहा है

Mozilla/5.0 (Macintosh; Intel Mac OS X 10_7_3) AppleWebKit/535.19 (KHTML, like Gecko) Chrome/18.0.1025.151 Safari/535.19

मैक ओएस एक्स पर फायरफॉक्स में चल रहा है

Mozilla/5.0 (Macintosh; Intel Mac OS X 10.7; rv:11.0) Gecko/20100101 Firefox/11.0

डिटेक्शन कोड

var is_uiwebview = /(iPhone|iPod|iPad).*AppleWebKit(?!.*Safari)/i.test(navigator.userAgent);
var is_safari_or_uiwebview = /(iPhone|iPod|iPad).*AppleWebKit/i.test(navigator.userAgent);

Question 4

मुझे लगता है कि आप बस का उपयोग कर सकते हैं User-Agent।

अपडेट करें

पेज आईफोन सफारी का उपयोग करके ब्राउज किया गया

Mozilla/5.0 (iPhone; U; CPU iPhone OS 4_1 like Mac OS X; en-us) AppleWebKit/532.9 (KHTML, like Gecko) Version/4.0.5 Mobile/8B117 Safari/6531.22.7

मैं UIWebView के साथ एक सेकंड में कोशिश करूंगा

Mozilla/5.0 (iPhone; U; CPU iPhone OS 4_1 like Mac OS X; en-us) AppleWebKit/532.9 (KHTML, like Gecko) Mobile/8B117

अंतर यह है कि सफारी एक कहता है Safari/6531.22.7

उपाय

var isSafari = navigator.userAgent.match(/Safari/i) != null;

Question 5

हाँ:

// is this an IPad ?
var isiPad = (navigator.userAgent.match(/iPad/i) != null);

// is this an iPhone ?
var isiPhone = (navigator.userAgent.match(/iPhone/i) != null);

// is this an iPod ?
var isiPod = (navigator.userAgent.match(/iPod/i) != null);

Question 6

मैंने इन सभी समाधानों की कोशिश की है, लेकिन मेरे मामले में काम नहीं किया,
मैं वेबव्यू के अंदर टेलीग्राम का पता लगाने जा रहा था । मैंने देखा है कि सफारी फोन शैली के टेक्स्ट को "tel:" उपसर्ग के साथ लिंक में बदल रही है, इसलिए मैंने इस कोड को लिखने के लिए इसका उपयोग किया है, आप इसका परीक्षण कर सकते हैं: jsfiddle

<!DOCTYPE html>
<html>
<head></head>
<body>
<ul id="phone" style="opacity:0">
    <li>111-111-1111</li>
</ul>
</body>
</html>

<script>

    var html = document.getElementById("phone").innerHTML;

    if (navigator.platform.substr(0,2) === 'iP') {

        if (html.indexOf('tel:') == -1)
            alert('not safari browser');
        else
            alert('safari browser');
    }
    else
        alert('not iOS');
</script>

Question 7

नियोनी का समाधान अब काम नहीं करता (टिप्पणियों को देखें) और इसे सरल बनाया जा सकता है। दूसरी ओर, यूए में केवल "सफारी" का परीक्षण, आईओएस हाथ में लेने वाले उपकरणों की तुलना में बहुत अधिक है।

यह परीक्षण मैं उपयोग कर रहा हूँ:

var is_ios = /(iPhone|iPod|iPad).*AppleWebKit.*Safari/i.test(navigator.userAgent);

Question 8

ध्यान दें कि यह दृष्टिकोण iOS 10 और पुराने संस्करणों के लिए काम नहीं करता है।

2018 के वसंत के लिए किसी भी प्रस्तावित विधि ने मेरे लिए काम नहीं किया इसलिए मैं एक नया दृष्टिकोण (जो उपयोगकर्ता आधारित नहीं है) के साथ आया:

const hasValidDocumentElementRatio =
  [ 320 / 454 // 5, SE
  , 375 / 553 // 6, 7, 8
  , 414 / 622 // 6, 7, 8 Plus
  , 375 / 812 // X
  , 414 / 896 // Xs, Xr
  ].some(ratio =>
    ratio === document.documentElement.clientWidth / 
      document.documentElement.clientHeight
  )

const hasSafariInUA = /Safari/.test(navigator.userAgent)

const isiOSSafari = hasSafariInUA && hasValidDocumentElementRatio  // <- this one is set to false for webviews

https://gist.github.com/BorisChumichev/7c0ea033daf33da73306a396ffa174d1

आईपैड उपकरणों के लिए भी कोड का विस्तार करने के लिए आपका स्वागत है, मुझे लगता है कि यह चाल करना चाहिए।

टेलीग्राम, फेसबुक, वीके वेब साक्षात्कार के लिए अच्छी तरह से काम किया।

Question 9

Working 15.02.19

IOS पर वेबव्यू का पता लगाने के लिए एक अन्य समाधान समर्थन / अस्तित्व के लिए जाँच कर रहा है navigator.mediaDevices।

if (navigator.mediaDevices) {
    alert('has mediaDevices');
} else {
    alert('has no mediaDevices');
}

मेरे मामले में मुझे सभी वेब साक्षात्कारों को पकड़ने की आवश्यकता नहीं थी, लेकिन जो कैमरा / माइक्रोफोन इनपुट का समर्थन नहीं करते हैं (अनुस्मारक: अलर्ट वेबव्यू में ट्रिगर नहीं होते हैं, इसलिए डीबग उद्देश्यों के लिए डोम में कुछ बदलना सुनिश्चित करें)

Question 10

मुझे पता है कि यह कोड यह जांच करेगा कि क्या इसे होम स्क्रीन पर जोड़े गए आइकन से एक्सेस किया जा रहा है:

if (window.navigator.standalone == true) {
//not in safari
}

लेकिन मुझे यकीन नहीं है कि यह UIWebView में कैसे प्रतिक्रिया देगा। एकमात्र ऐसा उपाय जिसके बारे में मैं सोच सकता था कि उपयोगकर्ता एजेंट प्राप्त कर रहा है या - (BOOL)webView:(UIWebView *)webView shouldStartLoadWithRequest:(NSURLRequest *)request navigationType:(UIWebViewNavigationType)navigationTypeउस पृष्ठ के क्वेरी स्ट्रिंग का उपयोग कर रहा है, जिसे आप किसी वेब दृश्य से एक्सेस करने के लिए उपयोग कर रहे हैं।

Question 11

का उपयोग करते हुए सुझाव है कि Modernizr , और जैसे IndexedDB के लिए जाँच इस । आप उपयोगकर्ता एजेंट कॉन्फ़िगरेशन (डिवाइस, ओएस, ब्राउज़र, आदि) के साथ क्रॉस-चेक कर सकते हैं, लेकिन शुद्ध सुविधा का पता लगाना अधिक अनुशंसित है।

Question 12

पिछली बार जब मुझे इसकी आवश्यकता थी (WebView उद्देश्यों के लिए JUST), मैंने इस चेक का उपयोग किया:

function isIOS() {
     return !/safari/.test( window.navigator.userAgent.toLowerCase()) || navigator.platform === 'iOS' || navigator.platform === 'iPhone';
}

Question 13

मैंने iPhone या iPad का पता लगाने के लिए एक सरल समाधान ढूंढ लिया है। यह मेरे लिए ठीक काम करता है।

var is_iPad = navigator.userAgent.match(/iPad/i) != null;
var is_iPhone = navigator.userAgent.match(/iPhone/i) != null;
    if(is_iPad || is_iPhone == true){
        //perform your action
    }

Question 14

IOS 13 के साथ प्रयास करें

      function mobileDetect() {


    var agent = window.navigator.userAgent;
    var d = document;
    var e = d.documentElement;
    var g = d.getElementsByTagName('body')[0];
    var deviceWidth = window.innerWidth || e.clientWidth || g.clientWidth;

    // Chrome
    IsChromeApp = window.chrome && chrome.app && chrome.app.runtime;

    // iPhone
    IsIPhone = agent.match(/iPhone/i) != null;

    // iPad up to IOS12
    IsIPad = (agent.match(/iPad/i) != null) || ((agent.match(/iPhone/i) != null) && (deviceWidth > 750)); // iPadPro when run with no launch screen can have error in userAgent reporting as an iPhone rather than an iPad. iPadPro width portrait 768, iPhone6 plus 414x736 but would probably always report 414 on app startup

    if (IsIPad) IsIPhone = false;

    // iPad from IOS13
    var macApp = agent.match(/Macintosh/i) != null;
    if (macApp) {
        // need to distinguish between Macbook and iPad
        var canvas = document.createElement("canvas");
        if (canvas != null) {
            var context = canvas.getContext("webgl") || canvas.getContext("experimental-webgl");
            if (context) {
                var info = context.getExtension("WEBGL_debug_renderer_info");
                if (info) {
                    var renderer = context.getParameter(info.UNMASKED_RENDERER_WEBGL);
                    if (renderer.indexOf("Apple") != -1) IsIPad = true;
                }
                ;
            }
            ;
        }
        ;
    }
    ;

    // IOS
    IsIOSApp = IsIPad || IsIPhone;

    // Android
    IsAndroid = agent.match(/Android/i) != null;
    IsAndroidPhone = IsAndroid && deviceWidth <= 960;
    IsAndroidTablet = IsAndroid && !IsAndroidPhone;



    message = ""


    if (IsIPhone) {

        message = "Device is IsIPhone"


    }
    else if (IsIPad) {

        message = "Device is ipad"

    } else if (IsAndroidTablet || IsAndroidPhone || IsAndroid) {

        message = "Device is Android"


    } else {

        message = "Device is Mac ||  Windows Desktop"

    }


    return {

        message: message,

        isTrue: IsIOSApp || IsAndroid || IsAndroidTablet || IsAndroidPhone

    }

}



const checkMobile = mobileDetect()

alert(checkMobile.message + "  =====>  " + checkMobile.isTrue)

Question 15

मुझे नहीं लगता कि क्लाइंट-साइड जावास्क्रिप्ट में आप कुछ विशिष्ट का उपयोग कर सकते हैं, लेकिन यदि आपके पास इस बात पर नियंत्रण है कि मूल UIWebView क्या कर सकता है, तो आप इसे उत्पन्न करने वाले उपयोगकर्ता एजेंट स्ट्रिंग के साथ खेलने पर विचार कर सकते हैं, और आपके लिए परीक्षण कर सकते हैं इसके बजाय क्लाइंट-साइड जावास्क्रिप्ट? थोड़ा सा हैक मुझे पता है, लेकिन हे ... यह सवाल उपयोगकर्ता एजेंट को ट्विक करने पर कुछ संकेत दे सकता है:

UIWebView (iPhone SDK) में उपयोगकर्ता एजेंट बदलें

Question 16

@ सोद, मेरे पास कोई उत्तर नहीं है, लेकिन मैं आश्वस्त नहीं हूं कि आप क्यों जांचना चाहते हैं, चूंकि, ब्राउज़र इंजन चाहे इसकी सफारी (ब्राउज़र) या एप्लिकेशन केवल इसका वेबकिट ही होगा, हां एप्लिकेशन ब्राउज़र इंजन क्षमताओं को कॉन्फ़िगर कर सकता है जैसे , चाहे आवेदन जेएस या डिस्प्ले इमेज आदि चलाना चाहता हो…

मेरा मानना है कि, आपको निश्चित संपत्ति की जाँच करनी चाहिए कि फ़्लैश ब्राउज़र द्वारा समर्थित है या नहीं, ब्राउज़र छवि प्रदर्शित करता है या नहीं, या हो सकता है कि आप स्क्रीन आकार की जांच करना चाहते हों,