Javascript 移动Safari页面卸载/隐藏/模糊以实现深度链接
我正在移动safari上寻找一个事件,该事件将检测页面何时因重定向而被隐藏。如果用户安装了我的应用程序,我想直接打开它,如果安装了,我想尝试facebook,如果没有,我想转到该id的网页Javascript 移动Safari页面卸载/隐藏/模糊以实现深度链接,javascript,ios,safari,mobile-safari,deep-linking,Javascript,Ios,Safari,Mobile Safari,Deep Linking,我正在移动safari上寻找一个事件,该事件将检测页面何时因重定向而被隐藏。如果用户安装了我的应用程序,我想直接打开它,如果安装了,我想尝试facebook,如果没有,我想转到该id的网页 如果安装了“myapp”,则会打开myapp。但是safari标签仍然会被重定向到facebook.com 如果未安装“myapp”,但facebook已安装,则会打开facebook ios应用程序。但是safari标签仍然会被重定向到facebook.com 我已使用以下HTML/JS创建了一个:
<!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>
重定向测试
开放奥利奥
jQuery(函数(){
jQuery('button')。在('click',function()上){
var myid=null,fbid=null;
//注意页面离开以杀死计时器
jQuery(窗口).on('pagehide pageshow blur unload',函数(){
如果(myid){
清除超时(myid);
}
如果(fbid){
清除超时(fbid);
}
});
window.location=”myapp://fbprofile/oreo";
var myid=setTimeout(函数(){
//设备上不存在我的应用程序,请打开facebook
window.location=“fb://profile/oreo”;
fbid=setTimeout(函数(){
//设备上不存在Facebook,请打开Facebook mobile
window.location=”https://www.facebook.com/oreo";
}, 100);
}, 100);
});
});
代码不错。编辑:(删除了关于添加的建议
返回false;
)尝试在
setTimeout
函数中设置检查,而不是仅仅清除超时。(我发现清除间隔比简单的1次setTimeout调用更有效)。此外,在尝试使用本机应用程序协议(如myapp://
或fb://
)之前,我会检查以确保用户不在桌面浏览器上,因为这些浏览器将尝试跟踪该位置并最终显示错误
尝试:
重定向测试
开放奥利奥
手机var-MobileXP=/安卓(安卓)手机var手机var手机var手机var手机XP=/安卓(安安卓)手机var手机var手机var手机var手机var手机var手机var手机XP=/安卓(安卓)安卓(安卓)前前去去去前去去去去去去去去去去去去去去去去去去去去去去去(安押)方方方方方方当事人(埃拉尼)埃埃文(埃埃埃文)埃尼在场在场在场在场在场在场在场在场在场在场在场在场,埃拉尼(埃埃文)埃文(埃文,埃埃尼)埃文,埃尼尼在场在场在场在场在场在场在场在场在场在场在场在场在场在场在场在场在场在场在场在场在场在场在场在场(埃文(埃文)埃文(埃文)埃文,埃尼尼尼尼尼尼尼尼尼,埃文(埃文(埃文,埃尼)埃尼在场在场在场在场在场在场在场(一);(iemobile | ppc)| xiino/i;
jQuery(函数(){
jQuery('button')。在('click',function()上){
//不要给桌面浏览器在nativeapp://协议上失败的机会
if(!mobileExp.test(navigator.userAgent)){
window.location=”https://www.facebook.com/oreo";
返回;
}
点击变量=+新日期,超时=100;
window.location=”myapp://fbprofile/oreo";
setTimeout(函数(){
//如果我们在(超时)后仍在这里,请尝试本机facebook应用程序
如果(+新日期-单击<超时*2){
log('clicked'+(+新日期-clicked)+'ago-转到FB');
window.location=“fb://profile/oreo”;
}否则{
log(“对于facebook来说太晚了”);
}
setTimeout(函数(){
//如果我们在另一次(超时)后仍在这里,请尝试facebook web app
如果(+新日期-单击<超时*2){
log('clicked'+(+新日期-clicked)+'ago-转到浏览器');
window.location=”https://www.facebook.com/oreo";
}否则{
log(“对于浏览器来说太晚了”);
}
},超时);
},超时);
});
});
当然,取消对控制台日志的注释,并尝试使用
timeout
的值。这段代码在IOS 6.1 Safari和Safari 6.0.2 Mac上测试成功。希望有帮助 谢谢你的提示!不幸的是,这不适用,因为我使用的是一个按钮和javascript重定向,而不是一个链接。所以没有“链接点击泡泡”事件可以取消。你是对的-我是从臀部拍摄的,完全没有看到这个事实!不过,关于浏览器检查的建议仍然有效。请参阅上面我编辑的答案-在setTimeout
函数中移动了相关检查,并删除了clearTimeout
s。Safari重新启动后将重新打开上次访问的页面,在这种情况下脚本将不起作用。为了避免这种行为,可以附加window.close()代码>到else
块。iOS 13.3上不使用Date
的Safari解决方案:
<!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>