2013-02-05 16 views
26

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

  1. यदि 'myapp' स्थापित है, तो myapp खोला गया है। लेकिन सफारी टैब अभी भी facebook.com पर रीडायरेक्ट हो जाता है
  2. यदि 'myapp' स्थापित नहीं है, लेकिन फेसबुक है, तो फेसबुक आईओएस ऐप खोला गया है। लेकिन सफारी टैब अभी भी facebook.com

पर पुनः निर्देशित होने पर मैं निम्न HTML/जे एस के साथ एक test link बना लिया है:

<!DOCTYPE html> 
    <html> 
    <head> 
      <title>Redirect Test</title> 
      <script type='text/javascript' src='//ajax.googleapis.com/ajax/libs/jquery/1.9.0/jquery.min.js'></script> 
      <meta name='viewport' content='initial-scale = 1.0,maximum-scale = 1.0' /> 
    </head> 
    <body> 
    <button>Open Oreo</button> 
    <script type='text/javascript'> 
    jQuery(function(){ 
      jQuery('button').on('click', function(){ 
        var myid = null, fbid = null; 

        // Watch for page leave to kill timers 
        jQuery(window).on('pagehide pageshow blur unload', function(){ 
          if (myid) { 
            clearTimeout(myid); 
          } 
          if (fbid) { 
            clearTimeout(fbid); 
          } 
        }); 

        window.location = "myapp://fbprofile/oreo"; 
        var myid = setTimeout(function(){ 

          // My app doesn't exist on device, open facebook 
          window.location = "fb://profile/oreo"; 
          fbid = setTimeout(function(){ 

            // Facebook doesn't exist on device, open facebook mobile 
            window.location = "https://www.facebook.com/oreo"; 
          }, 100); 
        }, 100); 
      }); 
    }); 
    </script> 
    </body> 
    </html> 

उत्तर

19

नाइस कोड।
संपादित करें: (return false; जोड़ने के बारे में हटा दिया सुझाव)

सिर्फ टाइमआउट समाशोधन की जगह में अपने setTimeout कार्यों के भीतर एक जांच करके देखें। (मुझे लगता है कि सरल 1-टाइम सेटटाइम कॉल के अंतराल में अंतराल के लिए समाशोधन अधिक प्रभावी है)। साथ ही, मैं यह सुनिश्चित करने के लिए जांचूंगा कि उपयोगकर्ता मेरे app:// या fb:// जैसे देशी ऐप प्रोटोकॉल को आजमाने से पहले डेस्कटॉप ब्राउज़र पर नहीं है क्योंकि वे ब्राउज़र उस स्थान का अनुसरण करने का प्रयास करेंगे और एक त्रुटि प्रदर्शित करने का प्रयास करेंगे।

प्रयास करें:

<!DOCTYPE html> 
<html> 
<head> 
    <title>Redirect Test</title> 
    <script type='text/javascript' src='//ajax.googleapis.com/ajax/libs/jquery/1.9.0/jquery.min.js'></script> 
    <meta name='viewport' content='initial-scale = 1.0,maximum-scale = 1.0' /> 
</head> 
<body> 
<button>Open Oreo</button> 
<script type='text/javascript'> 
var mobileExp = /android|avantgo|blackberry|blazer|compal|elaine|fennec|hiptop|ip(hone|od)|iris|kindle|lge |maemo|midp|mmp|mobile|o2|opera mini|palm(os)?|plucker|pocket|pre\/|psp|smartphone|symbian|treo|up\.(browser|link)|vodafone|wap|windows ce; (iemobile|ppc)|xiino/i; 

jQuery(function(){ 
    jQuery('button').on('click', function(){ 

     // Don't give desktop browsers a chance to fail on a nativeapp:// protocol 
     if(!mobileExp.test(navigator.userAgent)) { 
      window.location = "https://www.facebook.com/oreo"; 
      return; 
     } 

     var clicked = +new Date, timeout = 100; 

     window.location = "myapp://fbprofile/oreo"; 

     setTimeout(function(){ 
      // If we're still here after a (timeout), try native facebook app 
      if (+new Date - clicked < timeout*2){ 
       console.log('clicked '+ (+new Date - clicked) +' ago- go to FB'); 
       window.location = "fb://profile/oreo"; 
      } else { 
       console.log('too late for facebook'); 
      } 
      setTimeout(function(){ 
       // If we're still here after another (timeout), try facebook web app 
       if (+new Date - clicked < timeout*2){ 
        console.log('clicked '+ (+new Date - clicked) +' ago- go to browser'); 
        window.location = "https://www.facebook.com/oreo"; 
       } else { 
        console.log('too late for browser'); 
       } 
      }, timeout); 
     }, timeout); 
    }); 
}); 
</script> 
</body> 
</html> 
बेशक

, अन-टिप्पणी कंसोल लॉग और timeout का मूल्य के साथ प्रयोग कर कुछ करते हैं। यह सटीक कोड आईओएस 6.1 सफारी और सफारी 6.0.2 मैक में सफलतापूर्वक परीक्षण किया गया। आशा करता हूँ की ये काम करेगा!

+0

टिप के लिए धन्यवाद! दुर्भाग्य से यह लागू नहीं होता है क्योंकि मैं एक बटन का उपयोग कर रहा हूं और जावास्क्रिप्ट के साथ रीडायरेक्ट कर रहा हूं, बल्कि एक लिंक। इसलिए रद्द करने के लिए कोई 'लिंक क्लिक बबल' ईवेंट नहीं है। –

+0

आप सही हैं - मैंने कूल्हे से गोली मार दी और पूरी तरह से उस तथ्य को याद किया! हालांकि ब्राउज़र चेक के बारे में सुझाव खड़ा है। ऊपर दिए गए मेरे संपादित उत्तर को देखें - 'सेटटाइमआउट' कार्यों के भीतर प्रासंगिक चेक को ले जाया गया और 'clearTimeout' से छुटकारा पा लिया। – goddogsrunning

+0

सफारी एक बार फिर से शुरू होने वाले पृष्ठ पर फिर से शुरू होता है और इस मामले में स्क्रिप्ट काम नहीं करेगी। इस व्यवहार से बचने के लिए, आप 'window.close();' 'else' ब्लॉक में जोड़ सकते हैं। – ruphus

संबंधित मुद्दे