How to use google OAuth2 in a Sencha Touch2 application? - sencha-touch-2

Question

I build Web application using Sencha Touch2.
At iPhone, the application can be used by full screen.
I already have build web application for pc browser, and use google calendar API connecting with OAuth2.
The authorization step need to open new window to login the user google account.
Maybe I can build Sencha Touch application use the same architecture of pc,
but opening new window make the full screen application closed.
Do you know how to use google OAuth2 in a Sencha Touch2 application?
-- Add 2013/2/6
My Sencha Touch2 application is web application.
I want to know that it is possible to grant permission in the full screen web application, not in the browser.
-- Add 2013/2/7
I use the tip.
http://miketheindian.com/2012/02/22/staying-in-full-screen-mode-on-the-iphone-from-page-to-page/
This way is not need to open browser.
It is better than opening new window, but the best is authorizing in iframe...
-- Add 2013/2/13
Finally, I take the way;
Google AOuth is three patter, for user.
1.User google Account is logout, user must write user ID and password.
2.User google Account is login and but the application is not allowed, user must click "allow" button.
3.User google Account is login, user do not need to do anything.
When the time of 3., we can authorize in iframe.
And, when the time of 1. or 2., we can not authorize in frame, so use location.href change approach ( detail in http://miketheindian.com/2012/02/22/staying-in-full-screen-mode-on-the-iphone-from-page-to-page/ ).
Details
make view has the container
{
xtype: 'container',
html: '＜iframe src="" id="googleLogin" style="border:0;">'
},
change src in controller
var iframe = Ext.get(Ext.query('#googleLogin'));
iframe.set(
{
src: responseInformation.googleOAuthUrl
});
When the time of 3., user google account login , this is ok.
When the time of 1. or 2., we change location.href.
We want to handle iframe "onerror" event, but there is not that event.
I use settimer and check if the src of the iframe is not change first src (because of error redirecting to google login page).
3000 ms is not so meaning. When the time of 3., redirect is success and page has changed.
me.timerId = setInterval(function(){
if (iframe.el.dom.src.indexOf( /* first url */'') !== -1){
location.href = iframe.el.dom.src;
clearInterval(me.timerId);
}
}, 3000);

Answer 1

On Android, it's probably a good idea to use the local Contacts database on the device rather than working over the network. Yes, the user has to grant permission, but they would anyhow for network access. That way you don't need to spin out any extra browsers or anything.

Answer 2

There is another way to face the problem:
Use inAppBrowser plugin from Cordova or Sencha to launch the auth prompt, then, with a eventListener, wait for page load, and if url matches the success callback URL, then you can parse the url and get the auth/code or auth/token.
Example using Cordova:
window.authmodal = window.open(authorizationUrl, '_blank', 'location=yes');
window.authmodal.addEventListener('loadstart', function(event){
var code = getParam(event.url,"code");
if(code != null){
//here we got the code, now make a last request to get the TOKEN
OAuth2Helper.finish(function(token){
window.authmodal.close();
window.localStorage.setItem("token",token)
//do somethink else with your logic
},code)
}else{
//no code found in this page start.
}
});
NOTE: OAuth2Helper.finish, makes a request to the token url, using the code, in order to get a valid and usable token.