sencha touch 2 with youtube api oAuth - extjs

Question

Is there an example of how to integrate Sencha Touch 2 with youtube API OAuth?
Following the google api docs and Sencha Touch 2: How can I add Google+ Login? example , I used javascript based button rendering for google sign on in my application. However I run into cross origin issues with switching the http vs https context
Blocked a frame with origin "https://accounts.google.com" from accessing a frame with origin "http://localhost:1841. Protocols, domains, and ports must match

Answer 1

oAuth for Client Side Web Applications does not support http protocol for authentication requests.
Note: Requests to Google's authorization server must use https instead of http because the server is only accessible over SSL (HTTPs) and refuses HTTP connections.
Followed below approach:
Render a link to redirect the app to google auth page. You need to register your application with google and get access_token, client_id etc.
In Sencha touch view, add a component like below:
{
styleHtmlContent: true,
html : 'Login to youtube'
}
Note: Entire url used in anchor element must be url encoded string.
Redirect URI configured will be typically same view that rendered the login link. Upon redirect, URL will contain access_token hash tag. Grab it from URL and proceed with regular youtube accessing functionality.
launch: function () {
if ( window.location.hash ) {
this.onAuthRedirect();
}
// Destroy the #appLoadingIndicator element
Ext.fly('appLoadingIndicator').destroy();
// Initialize the main view
Ext.Viewport.add(Ext.create('MyApp.view.Main'));
},
onAuthRedirect: function () {
if (window.location.hash) {
var params = window.location.hash.substring(1).split('&');
if (params[0].split('=')[0] == 'access_token') {
var access_token_value = params[0].split('=')[1];
//validate access_token and proceed with youtube access api stuff
}
}
},