移动Safari页面卸载/隐藏/模糊深入链接
我正在寻找移动Safari浏览器上的一个事件，它将检测到页面由于redirect而被隐藏。 我想直接打开我的应用程序，如果用户已经安装，然后尝试Facebook的，如果安装，如果没有，然后转到该网页的ID。
- 如果安装了“myapp”，则打开myapp。 但Safari浏览器标签仍然被redirect到facebook.com
- 如果'myapp'没有安装，但Facebook是，那么Facebook的iOS应用程序被打开。 但Safari浏览器标签仍然被redirect到facebook.com
我用下面的HTML / JS创build了一个testing链接 ：
<!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> 不错的代码。
编辑:(删除关于添加return false;build议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上成功testing了这个确切的代码。 希望能帮助到你！