জাভাস্ক্রিপ্টের মাধ্যমে আইপ্যাড / আইফোন ওয়েবভিউ সনাক্ত করুন

Question 1

ওয়েবসাইটগুলি আইপ্যাড সাফারির ভিতরে বা কোনও অ্যাপ্লিকেশন ওয়েবভিউয়ের ভিতরে চলে গেলে জাভাস্ক্রিপ্টের মাধ্যমে কী আলাদা হওয়ার কোনও উপায় আছে?

Question 2

এটি window.navigator.userAgentএবং এর সংমিশ্রণ ব্যবহার করে window.navigator.standalone। এটি কোনও আইওএস ওয়েব অ্যাপ্লিকেশন সম্পর্কিত চারটি রাজ্যের মধ্যে পার্থক্য করতে পারে: সাফারি (ব্রাউজার), স্ট্যান্ডেলোন (পূর্ণস্ক্রিন), ইউইউবিউউ, এবং আইওএস নয়।

ডেমো: 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

ব্যবহারকারী এজেন্ট

ইউআইওয়েবভিউতে চলছে

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

আমি ইউআইবিউবভিউয়ের সাথে এক সেকেন্ডে চেষ্টা করব

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

আমি এই সমস্ত সমাধান চেষ্টা করেছি কিন্তু আমার ক্ষেত্রে কাজ করে নি,
আমি ওয়েবভিউয়ের মধ্যে টেলিগ্রামটি সনাক্ত করতে যাচ্ছি । আমি লক্ষ্য করেছি যে সাফারি "টেল:" উপসর্গের একটি লিঙ্কে ফোন স্টাইলের পাঠ্য পরিবর্তন করছে, তাই আমি এই কোডটি লিখতে এটি ব্যবহার করেছি, আপনি এটি পরীক্ষা করতে পারেন: 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

নোট করুন যে এই পদ্ধতিটি আইওএস 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

আইওএস-এ ওয়েবভিউ সনাক্ত করার জন্য আরেকটি সমাধান হ'ল এর সমর্থন / অস্তিত্বের জন্য যাচাই করা navigator.mediaDevices।

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

আমার ক্ষেত্রে আমার সমস্ত ওয়েবভিউ ধরার দরকার ছিল না, তবে যারা ক্যামেরা / মাইক্রোফোন ইনপুট সমর্থন করে না (অনুস্মারক: সতর্কতাগুলি ওয়েবভিউতে ট্রিগার করে না, তাই ডিবাগের উদ্দেশ্যে ডোমে কিছু পরিবর্তন করার বিষয়টি নিশ্চিত করুন)

Question 10

আমি জানি এই কোডটি হোম স্ক্রিনে যুক্ত হওয়া আইকন থেকে অ্যাক্সেস করা হচ্ছে কিনা তা যাচাই করবে:

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

তবে আমি নিশ্চিত না যে এটি কোনও ইউআইবিউভিউতে কীভাবে প্রতিক্রিয়া করবে। কেবলমাত্র অন্য সমাধানের জন্য যা আমি ভাবতে পারি তা হ'ল ব্যবহারকারীর এজেন্ট পাওয়া বা - (BOOL)webView:(UIWebView *)webView shouldStartLoadWithRequest:(NSURLRequest *)request navigationType:(UIWebViewNavigationType)navigationTypeআপনি যে পৃষ্ঠাটি ব্যবহার করছেন যা পৃষ্ঠাটির কোনও কিছুর সাথে অ্যাক্সেস করছেন সেটিকে অনুসন্ধান এবং এটি ওয়েব ভিউ থেকে অ্যাক্সেস করা হচ্ছে তা চিহ্নিত করার পরিবর্তে।

Question 11

ব্যবহার সুপারিশ করবে Modernizr এবং অন্য কোনো IndexedDB পরীক্ষা করার এই । আপনি ব্যবহারকারী এজেন্ট কনফিগারেশন (ডিভাইস, ওএস, ব্রাউজার, ইত্যাদি) দিয়ে ক্রস-চেক করতে পারেন, তবে খাঁটি বৈশিষ্ট্য সনাক্তকরণ আরও প্রস্তাবিত বলে মনে হচ্ছে।

Question 12

শেষবার যখন আমার এটির প্রয়োজন হয়েছিল (ওয়েবউউয়ের উদ্দেশ্যে জাস্ট), আমি এই চেকটি ব্যবহার করেছি:

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

Question 13

আইফোন বা আইপ্যাড সনাক্ত করার জন্য আমি একটি সহজ সমাধান খুঁজে পেয়েছি। এটা আমার জন্য কাজ করে।

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

আইওএস 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 কী করতে পারে তার উপর আপনার যদি নিয়ন্ত্রণ থাকে তবে আপনি এটির উত্সারকারী এজেন্ট স্ট্রিংয়ের সাথে খেলতে এবং আপনার ক্ষেত্রে এটি পরীক্ষা করার বিষয়টি বিবেচনা করতে চাইতে পারেন পরিবর্তে ক্লায়েন্ট সাইড জাভাস্ক্রিপ্ট? আমি জানি কিছুটা হ্যাক, তবে ওহে… এই প্রশ্নটি ব্যবহারকারী এজেন্টকে টুইট করার বিষয়ে কিছু পয়েন্টার দিতে পারে:

ইউআইবিউবভিউ (আইফোন এসডিকে) এর ব্যবহারকারী এজেন্ট পরিবর্তন করুন

Question 16

@ সোড, ভাল আমার উত্তর নেই তবে আপনি কেন চেক করতে চান তা আমি নিশ্চিত নই, যেহেতু, ব্রাউজার ইঞ্জিনটি তার সাফারি (ব্রাউজার) বা অ্যাপ্লিকেশন কেবল তার ওয়েবকিটের মতো হবে কিনা, হ্যাঁ অ্যাপ্লিকেশন যেমন ব্রাউজার ইঞ্জিনের ক্ষমতাগুলি কনফিগার করতে পারে , অ্যাপ্লিকেশনটি জেএস বা প্রদর্শন চিত্র ইত্যাদি চালাতে চায় কিনা…

আমি বিশ্বাস করি, আপনাকে অবশ্যই ব্রাশারের দ্বারা সমর্থিত ফ্ল্যাশ বা ব্রাউজার চিত্র প্রদর্শন করবে কিনা তা নির্দিষ্ট সম্পত্তি যাচাই করতে হবে, বা সম্ভবত আপনি পর্দার আকার পরীক্ষা করতে চান,