👔 🤳🏼 👨🏾‍🤝‍👨🏻 URL योजना: जावास्क्रिप्ट में एक स्थापित अनुप्रयोग के लिए जाँच 🤜🏾 🛀🏽 ↔️

हाल ही में, मुझे यह निर्धारित करने की आवश्यकता के साथ सामना किया गया था कि क्या URL स्कीम ब्राउज़र में पंजीकृत है, ताकि परिणाम के आधार पर, इसे डाउनलोड करने के लिए या तो एप्लिकेशन डाउनलोड बटन या प्रत्यक्ष URL दिखाएं।

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

मैं आपको तुरंत चेतावनी देना चाहता हूं कि एक भी ऐसा तरीका नहीं था जो कम से कम दो ब्राउज़रों में समान रूप से काम करता हो। इसलिए, सुंदर क्रॉस-ब्राउज़र समाधान के प्रशंसक निराश होंगे - लेख हैक से भरा है (कृपया इसके लिए ऋण न लें, यह बीमारी है, लेकिन कार्य कार्य है)।

सबसे पहले, हमारे लिंक बनाएं।

<a class="runlink" href="myapp://command_line_parameters">Run</a> <a class="downloadlink" style="display:none;" href="http://mysite.com/download/app.exe">Download</a>

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

 function initApplicationLink(runlink, downloadlink) { //   var func = null; if (navigator.userAgent.indexOf('Firefox')>=0 ) func = checkFirefox; else if (navigator.userAgent.indexOf('Opera')>=0 ) func = checkOpera; else if (navigator.userAgent.indexOf('Chrome')>=0 ) func = checkChrome; else if (navigator.userAgent.indexOf('Safari')>=0 ) func = checkSafari; if ( func!=null ) { //   Download $(downloadlink).hide(); //          $(runlink).on('click', function(){ func(runlink, downloadlink); //   ,        return false; }); } else { //        Download $(downloadlink).show(); } } function downloadConfirmation(downloadlink) { if ( confirm('You need to install our application first. Do you really want to download it now?') ) document.location = $(downloadlink).attr('href'); }

आइए फ़ायरफ़ॉक्स और ओपेरा के साथ शुरू करें, क्योंकि वे इस मामले में 100% विश्वसनीय और सुंदर अपवाद तंत्र प्रदान करते हैं। लेकिन दुर्भाग्य से, कार्यान्वयन अभी भी अलग है।

फ़ायरफ़ॉक्स का सबसे सरल समाधान है।

 function checkFirefox(runlink, downloadlink) { //   ,      URL var f = createFrame(); try { f.contentWindow.location = $(runlink).attr('href'); } catch (e) { //  URL   ,      downloadConfirmation(downloadlink); } //     deleteFrame(f); }

ओपेरा फ़ायरफ़ॉक्स से बहुत अलग नहीं है, सिवाय इसके कि यह एक अपवाद को नहीं पकड़ता है जब यह एक URL को अनरजिस्टर्ड प्रोटोकॉल के साथ फ्रेम में लोड करने की कोशिश करता है, लेकिन जब यह एक अपरिभाषित फ़्रेम विशेषता (contentWindow.location) तक पहुंचने का प्रयास करता है।

 function checkOpera(runlink, downloadlink) { var f = createFrame(); f.contentWindow.location = $(runlink).attr('href'); setTimeout(function (){ try { //        // ( something   -) if ( f.contentWindow.location!='something' ) {} } catch (e) { downloadConfirmation(downloadlink); } deleteFrame(f); }, 0); }

फ़ायरफ़ॉक्स और ओपेरा के लिए createFrame () और deleteFrame () फ़ंक्शन:

 function createFrame() { var f = document.createElement('iframe'); f.style.display = 'none'; return document.body.appendChild(f); } function deleteFrame(f) { document.body.removeChild(f); }

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

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

दुर्भाग्य से, यह विधि 100% स्थिर नहीं है। उदाहरण के लिए, यदि ब्राउज़र ने टाइमआउट के दौरान एप्लिकेशन को खोलने का प्रबंधन नहीं किया, या इसके विपरीत, उपयोगकर्ता टाइमआउट होने से पहले एप्लिकेशन को बंद करने में कामयाब रहा, और विंडो ने फिर से फोकस प्राप्त किया। नतीजतन, इस तरह के विकल्प के परिणामस्वरूप निम्न अप्रिय तस्वीर दिखाई देती है। एक विंडो आपको डाउनलोड करने के लिए कहती है, और एक सेकंड के बाद आवेदन शुरू होता है। या इसके विपरीत - आवेदन शुरू होता है, उपयोगकर्ता इसे तुरंत बंद कर देता है, और एक विंडो डाउनलोड सुझाव के साथ दिखाई देती है। इसलिए, टाइमआउट बढ़ाना या घटाना लगभग उतना ही बुरा है (वृद्धि अभी भी थोड़ी बेहतर है, क्योंकि ज्यादातर मामलों में उपयोगकर्ता तुरंत नए खुले एप्लिकेशन को बंद नहीं करेगा)। व्यवहार में, एक सेकंड का समय सबसे स्वीकार्य है।

 function checkSafari(runlink, downloadlink) { if ( navigator.userAgent.indexOf('Windows')>=0 ) { //        URL var w = window.open($(runlink).attr('href'), '', 'width=50, height=50'); setTimeout(function(){ try { //        if ( w.location!='about:blank' ) {} w.close(); window.focus(); } catch (e) { w.close(); window.focus(); downloadConfirmation(downloadlink); } }, 1000); } else { //  MacOS    iOS document.location = $(runlink).attr('href'); setTimeout(function(){ //   -  ,     if ( window.isFocused ) downloadConfirmation(downloadlink); }, 1000); } } //         window.isFocused = true; $(window).on('focus', function(){ window.isFocused = true; }) .on('blur', function(){ window.isFocused = false; });

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

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

 function checkChrome(runlink, downloadlink) { document.location = $(runlink).attr('href'); setTimeout(function(){ if ( window.isFocused ) downloadConfirmation(downloadlink); }, 1000); }

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

अब हमें बस अपने लिंक को इनिशियलाइज़ करना है।

 initApplicationLink('.runlink', '.downloadlink');

नोट: समाधान का परीक्षण विंडोज और मैकओएस प्लेटफॉर्म पर क्रोम, फ़ायरफ़ॉक्स, ओपेरा, सफारी और IE के नवीनतम संस्करणों में किया गया था। मोबाइल ब्राउज़रों में कोई परीक्षण नहीं थे, लेकिन टाइमआउट विकल्प एंड्रॉइड और आईओएस पर कारगर साबित हो सकता है।

URL योजना: जावास्क्रिप्ट में एक स्थापित अनुप्रयोग के लिए जाँच

More articles: