OAuth callbacks in iPhone web apps

14
votes

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?

2
iphoneoauthtwitter-oauthiphone-web-appiphone-standalone-web-app
just wanted to say there is no way to programmatically re-launch an app (maybe you can on a jailbroken device but not under normal conditions) – mattacular
Just to clarify. Since you are building a web app, you are already in Mobile Safari. Do you mean to say that the authentication page opens in a new page in Safari? – Jon Nylander
When you save an iPhone optimized web app to the home page and run it from there it actually doesn't open in Safari. Well, it's still rendered by Safari under the covers, but it launches like a stand alone app. It gets it's own icon in the fast app switching task bar and everything. The problem is that a link to Twitter leaves that container. – mustpax

2 Answers

15
votes

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!

1
votes

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