OAuth callbacks in iPhone web apps

Question

I'm building a full-screen iPhone optimized web app. It gets launched from the homepage like a native app and behaves like a standalone app via the following directive, but it's just plain HTML/CSS/JavaScript, no PhoneGap involved.

<meta name="apple-mobile web-app-capable" content="yes" />

When trying to authenticate over OAuth, the redirect to Twitter (or any other OAuth provider) takes me out of my full-screen web app and into Mobile Safari. Once the Twitter auth completes, the redirect back to my app does not launch my homepage app, instead just redirects within Mobile Safari. Is it possible to do OAuth inside an iPhone homepage web app? Short of that, can I get the OAuth callback to re-launch my homepage web app?

Answer 1

I've had a similar problem recently, and found that if you set the URL in Javascript with a window.location.href="http://example.com/whatever" then iOS doesn't switch to Safari. I've managed to get PayPal checkout and Facebook login working in standalone web apps without switching to safari using this method! If you're submitting a form, do that via JS too and get the redirect URL from the response then set the location. As for handing back to your app afterwards, it depends on how the external service works.

If that's no good, you could do a pop-up alert('You will be passed to Safari for authentication. Reload this app afterwards.') before they get switched to Safari. Not great, but better than surprising them with automatically switching apps!

Answer 2

I´m assuming that you have a "manifest" meta tag to reference manifest.json file.

I suggest you to do the following workaround. It works perfect on ios safari web app:

https://stackoverflow.com/a/52286655/8390589