Phonegap and OAuth2

I am developing a PhoneGap application and require that my users log in to Google through OAuth2. Is this possible directly through JavaScript? I have almost no experience with JavaScript (and jQuery).

What are the options? I thought of a cumbersome alternative that involves placing a username / password for an application that I hosted on a server, which then takes care of the login. Then, the PhoneGap application will need to ask the server if the authentication was successful. However, I was hoping there would be an easier way.

What is the best way to log in to Google through the PhoneGap app?

+7
source share
2 answers

I managed to get it to work! I post my thoughts here because it was difficult for me to find the answer after hours of searching the Internet.

Important steps are:

  • Verify that ChildBrowser is working correctly
  • Setting up a function that will listen for page changes window.plugins.childBrowser.onLocationChange = function(fooUrl) { console.log(fooUrl); } window.plugins.childBrowser.onLocationChange = function(fooUrl) { console.log(fooUrl); }
  • Create the URL using the query string as described in this tutorial
  • Point your ChildBrowser address to the URL
  • When the user logs in, you can retrieve the session token from fooUrl

If you still don't know how to do this, check out this Android app . (There is a lot of code, and this may seem overwhelming, so I suggest only doing this as a last resort)

+8
source

Google will not allow you to perform direct authentication by directly processing user credentials. Instead, Google wants you to implement an authentication protocol, typically OAuth 2.0. Other popular authentication protocols you may hear about are OpenID 1.0, 2.0, OpenID Connect, SAML 2.0, ID-FF, etc. These protocols will redirect the user to the Identity Provider (in this case, Google) and send you an assertion that you can use to trust the user. Using APIs such as Google, you should use the OAuth authorization functionality, which provides you with a token that you can use with all Google APIs after authentication.

With PhoneGap and mobile apps, everything is a little different than the typical OAuth setup.

In your case, the browser is in a controlled environment, in your application, and you can

  • select to redirect the user to the Google authorization endpoint using native mode,
  • select to open ChildBrowser with the Google authorization endpoint so as not to lose any state in your application.
  • to somehow open Safari or another browser with an authorization endpoint and register your own scheme handler to redirect the user back to your application after authentication.

These examples are vaguely mentioned in the OAuth 2.0 specifications, but there is no help on what is best or optimal in a particular use case. Often the best option is not ideal (from the point of view of the user).

I recently wrote a tutorial on how to make this work with Phonegap and ChildBrowser for iOS.

+4
source

All Articles