Mobile WebApp on iOS

[AndyCr15]

Hi, me again!

I've tried to set my 'site' up as a mobile web app. I've got bits in the header like this -

<meta name="viewport" content="minimal-ui, width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no, shrink-to-fit=no">
<meta name="apple-mobile-web-app-capable" content="yes">
<link rel="apple-touch-icon" href="images/logo.png">

<meta name="mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-title" content="WebApp Name" />
<link rel="apple-touch-icon" href="apple-touch-icon.png">

<link rel="icon" sizes="192x192" href="images/appicon.jpg">

And I've tried various solutions in JavaScript to stop it going out to a browser when a link is pressed. At the moment, it's this -

<script>
(function(a,b,c){
    if(c in b&&b[c]){
        // keep links within the webapp
        var d,e=a.location,f=/^(a|html)$/i;a.addEventListener("click",function(a){
            d=a.target;while(!f.test(d.nodeName))d=d.parentNode;"href"in d&&(d.href.indexOf("http")||~d.href.indexOf(e.host))&&(a.preventDefault(),e.href=d.href)
            },!1)
            }
            })(document,window.navigator,"standalone")
</script>

That generally works, except the login page, Google's login, which even as a standard link, opens Safari. When I login with Google in Safari, the webapp still sits waiting to be logged in...

If I do everything through Safari, it all works fine.

Does that make sense? Does anyone have any tips to keep everything in the webapp? On Android it all works fine within the webapp.

 

[AndyCr15]

i did more research and found the issue is unavoidable apparently. A webapp on iOS is opened in a webview. Google says that's not secure enough, so when you go to auth with Google it opens Safari for you to log in. This information (the login auth) is not accessible from the webview.

I've removed the stuff making iOS make it a webapp. I've had a look for things to simply hide the url bar, but the main options out there don't seem to work