OAuth2

 

 

How do you do OAuth2 in cordova/phonegap apps?

I have been asked this question multiple times in the last few years, and I always just sort of dismissed it as being easy.  I would typically say 'Use the InAppBrowser plugin and watch for location changes.'  A recent pull-request to the InAppBrowser asking to add potentially un-secure Android intent/protocol support tells me I need to do a bit more to explain and show how this works.

Here is what I meant when I dismissed this as trivial:

var endUrl = "https://phonegap.com/authCallback"; 
var startUrl = "http://github.com/login/oauth/authorize/"; 
startUrl += "?client_id=89855411f5d2ab238ad2"; 
startUrl += "&redirect_uri=" + endUrl; 
// scope, state, allow_signup also available 


var browser = cordova.InAppBrowser.open(startURL, '_blank', 'location=yes');
browser.addEventListener('loadstart', function(evt){
console.log('evt.url = ' + evt.url);
if(evt.url.indexOf(endURL) == 0) {
// close the browser, we are done!
browser.close();
  // TODO: pull the token out and use it for further API calls.
}
});

browser.addEventListener('loaderror', function(err) {
console.log("error " + err);
// TODO: handle this!
});

Of course, you will need the InAppBrowser plugin installed for this to work, but it's pretty easy right?

Just in case you would like it easier still, I have thrown together a plugin that does it for you.  Here is how you can accomplish the same thing with the plugin:

var endUrl = "https://phonegap.com/authCallback"; 
var startUrl = "http://github.com/login/oauth/authorize/"; 
startUrl += "?client_id=89855411f5d2ab238ad2"; 
startUrl += "&redirect_uri=" + endUrl; 
// scope, state, allow_signup also available 

PG_OAuth2.authenticate(function(url){ 
// TODO: pull the token out and use it for further API calls.  
}, 
function(err) { 
  // TODO: handle this
}, startUrl,endUrl); 
});

Install the plugin like this: 

cordova plugin add https://github.com/purplecabbage/phonegap-plugin-oauth2

As always, I welcome your comments, critiques, issues, and of course pull requests.

Cheers!

-J