Created
June 23, 2011 06:30
-
-
Save kylebarrow/1042026 to your computer and use it in GitHub Desktop.
Prevent links in standalone web apps opening Mobile Safari
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<!DOCTYPE html> | |
<head> | |
<title>Stay Standalone</title> | |
<meta name="apple-mobile-web-app-capable" content="yes"> | |
<meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no"> | |
<script src="stay_standalone.js" type="text/javascript"></script> | |
</head> | |
<body> | |
<ul> | |
<li><a href="http://google.com/">Remote Link (Google)</a></li> | |
<li><a href="javascript:alert('Awesome script is awesome')">JavaScript Link</a></li> | |
<li><a href="/">Local Link</a></li> | |
<li><a href="#amp">Local Anchor</a></li> | |
</ul> | |
</body> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
// Mobile Safari in standalone mode | |
if(("standalone" in window.navigator) && window.navigator.standalone){ | |
// If you want to prevent remote links in standalone web apps opening Mobile Safari, change 'remotes' to true | |
var noddy, remotes = false; | |
document.addEventListener('click', function(event) { | |
noddy = event.target; | |
// Bubble up until we hit link or top HTML element. Warning: BODY element is not compulsory so better to stop on HTML | |
while(noddy.nodeName !== "A" && noddy.nodeName !== "HTML") { | |
noddy = noddy.parentNode; | |
} | |
if('href' in noddy && noddy.href.indexOf('http') !== -1 && (noddy.href.indexOf(document.location.host) !== -1 || remotes)) | |
{ | |
event.preventDefault(); | |
document.location.href = noddy.href; | |
} | |
},false); | |
} |
This solution appears to launch URLs in a lightbox from the Web App in iOS 13.2. Is anyone else seeing this behavior?
@justinputney Yes, seeing same thing here.
@johnbarratt Thanks for the confirmation. Let me know if you find a fix where it doesn't trigger a ligthbox.
@justinputney : Just found this, seems to fix it, you just need a bare bones manifest, though it only works for pages added after the manifest was added to the site : https://stackoverflow.com/questions/58210991/peculiar-pwa-bug-on-safari-ios-13-1-2
@johnbarratt Thanks!
correct me if I'm wrong, but to prevent links from opening in safari, isn't just the scope
the only thing you need to add to your manifest? No javascript, no hacks no nothing just a single line in the json file.
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Is there any way to make this work on iframes. I mean all links opened within the iframe open in the web app?