I am looking for an event on mobile safari that will detect when the page has been hidden due to a redirect. I want to open my app directly if a user has it installed, then attempt facebook if it is installed, and if not then go to the webpage for that id.
- If 'myapp' is installed, then myapp is opened. But the safari tab still gets redirected to facebook.com
- If 'myapp' is not installed, but facebook is, then facebook ios app is opened. But the safari tab still gets redirected to facebook.com
I've created a test link with the following 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>