移動Safari瀏覽器頁面卸載/隱藏/模糊深入鏈接

我正在尋找移動Safari瀏覽器上的事件，當頁面被重定向時將會檢測到頁面被隱藏。我想直接打開我的應用程序，如果用戶安裝它，然後嘗試Facebook，如果它安裝，如果沒有，然後去該網頁的ID。移動Safari瀏覽器頁面卸載/隱藏/模糊深入鏈接

如果安裝了「myapp」，則打開myapp。但Safari瀏覽器標籤仍然被重定向到facebook.com
如果'myapp'沒有安裝，但是facebook是，那麼facebook ios應用程序被打開。但Safari的標籤仍然被重定向到facebook.com

我已經創建了下面的HTML/JS一個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>

來源

2013-02-05 Corey Hart

漂亮的代碼。
編輯：（約增加return false;刪除建議）

嘗試在短短清除超時設置代替您setTimeout功能中的檢查。（我發現清除對間隔而言更有效，而不是簡單的1次setTimeout調用）。此外，我會在嘗試使用本機應用協議（如我的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值試驗。在IOS 6.1 Safari和Safari 6.0.2 Mac中成功測試了此確切代碼。希望能幫助到你！

來源

2013-02-07 12:49:49 goddogsrunning

感謝您的提示！不幸的是，這不適用，因爲我正在使用一個按鈕並用JavaScript重定向，而不是鏈接。所以沒有'鏈接點擊泡泡'事件取消。 –

你是對的 - 我從臀部開槍，完全錯過了這個事實！雖然，關於瀏覽器檢查的建議仍然存在。看到我上面編輯的答案 - 移動'setTimeout'函數中的相關檢查，並擺脫了'clearTimeout's。 – goddogsrunning

Safari在重新啓動後重新打開上次訪問的頁面，在這種情況下腳本將不起作用。爲了避免這種行爲，可以將'window.close（）;'附加到'else'塊。 – ruphus

移動Safari瀏覽器頁面卸載/隱藏/模糊深入鏈接

回答

相關問題