Login with Google (Oauth 2.0)

You must Login before you can answer or comment on any questions.

Hi all,

I have the scenario like this :

Login with Google (by using OAUTH 2.0) to get refresh token. This process opens up a Web View and communicates with Google. The user logs in with Google’s web page and then Google returns the program the refresh token and email.

Does anyone have an idea how to implement this. First time working with google authorization.

Thanks

9 Answers

Accepted Answer

GoogleService.js here

app.js:

var Google = require('services/GoogleService').GoogleService;
 
var win = Ti.UI.createWindow({
    fullscreen: true,
    backgroundColor: '#fff',
    navBarHidden: false,
    title: 'Demo'
});
win.open();
 
// Google params
var ggParams = {
    clientId: '<client id>',
    clientSecret: '<client secret>',
    redirectUri: 'urn:ietf:wg:oauth:2.0:oob',
    devKey: 'dev key',
}
 
// Initialize Youtube Service
var google = new Google(ggParams);
 
google.login(function(e){
    Ti.API.info('Token: ' + google.accessToken());
 
    google.refreshToken(function(e){
        Ti.API.info('New Token: ' + e.token);
    });
});
I hope this gets you started. Click here for more information

— answered 2 years ago by Ayorinde Adesugba
answer permalink
12 Comments
  • Ayorinde, thanks! that looks very useful. (not tested yet)

    I don't understand what you have going on with the redirectUri though.

    — commented 2 years ago by Kosso .

  • Thanks Ayorinde , GoogleServices i saved it in my resources folder and the above code in app.'s Can u tell me from where i can get the client ID , client Secret and dev key . ?

    — commented 2 years ago by mathew orleans

  • @Kosso, when an application is registered in the Google Console as an Installed Application, google gives 2 standard redirect Uris urn:ietf:wg:oauth:2.0:oob and http://localhost.

    The flow for getting the temporary token is different for both uris.

    urn:ietf:wg:oauth:2.0:oob:

    If successfully logged in, the url contains "approval" and the user is redirected to a page where the temporary token is the HTML title. So i had to use webview.evalJS('document.title').

    http://localhost:

    If successfully logged in, the url contains this redirect uri, and i simply tokenize the url to grab the temporary token. *** Not sure if this works without a custom webview module that returns URLs before they are loaded. I believe Appcelerator chokes on opening http://localhost

    Once a temporary token is gotten, the appropriate call is made to the API to get the actual ACCESS_TOKEN. This returns a REFRESH_TOKEN, which is used to renew the ACCESS_TOKEN when it gets invalidated.

    Hope my explanation helps a bit more.

    — commented 2 years ago by Ayorinde Adesugba

  • Show 9 more comments

I have this working for login succesfully but I'm unable to use it to logout of google. Can anybody point me in the right direction please?

Thanks!

— answered 2 years ago by Brett Maddern
answer permalink
1 Comment
  • I can authenticate the user successfully using this but does anyone know how to get the logged in user information after authenticating? I tried multiple things but with no success...

    — commented 1 year ago by Subbu MV

I have been struggling with this for days!!! Can someone please say how to get user data afte authenticating into google? Pleaseeee

— answered 1 year ago by Subbu MV
answer permalink
1 Comment
  • i am getting following error while refreshing token.

    [ERROR] : GoogleService ERROR Authentication needed [ERROR] : GoogleService ERROR [object Object]

    — commented 9 months ago by deepak pardeshi

Try this:

var Google = require('GoogleService').GoogleService  //Make sure path is correct
 
var win = Ti.UI.createWindow({
    fullscreen: true,
    backgroundColor: '#fff',
    navBarHidden: false,
    title: 'Demo'
});
win.open();
 
// Google params
var ggParams = {
    clientId: '<replace with client id>',
    clientSecret: '<replace with client secret>',
    redirectUri: 'urn:ietf:wg:oauth:2.0:oob',
    devKey: '<replace with dev key>',
}
 
// Initialize Google Service
var google = new Google(ggParams);
 
google.login(function(e){
    Ti.API.info('Token: ' + google.accessToken());
 
    google.refreshToken(function(e){
        Ti.API.info('New Token: ' + e.token);
    });
 
    var params = {
        params: [],
        call: 'userinfo',
        method: 'GET'
    };
 
    google.callMethod(params, function(e) {
        Ti.API.info(e);
    }, null);
});
The callback should return the user info.

— answered 1 year ago by Ayorinde Adesugba
answer permalink
1 Comment
  • This works perfectly! Thanks a lot!!!! The person who started this thread should mark this as an accepted answer - so that others could also benefit....

    — commented 1 year ago by Subbu MV

Get the keys from the Google Console here

— answered 2 years ago by Ayorinde Adesugba
answer permalink
8 Comments
  • Login -> Click Create Project -> On the right select API Access -> Click Create Client Id -> Select Installed Application

    — commented 2 years ago by Ayorinde Adesugba

  • Thanks for the help. But when the authentication page opens i can't see my back button in the nab bar , which i created through navigation controller. I think the web view id hiding my window. How can i see the back button on this web view.?

    — commented 2 years ago by mathew orleans

  • I am getting THIS page , but i also want a back button on top left corner of the nav bar , how do i do that??

    I have a structure like this. 1)Button 2)Click on the button will open the google authorization page(have created this page as google.js and put it in the navgroup) 3)I can see my back button in the nab bar when i sign out from the google.

    So the google web view is overlapping my nab group window.

    — commented 2 years ago by mathew orleans

  • Show 5 more comments

The window is modal (check showAuthorizeUI()). You can add a left/right nav button easily using win.leftNavButton = somebutton.

Does the authentication/authorization work?

From Where did i can get Client ID and Client Secret.

— answered 9 months ago by Jayesh Joshi
answer permalink
1 Comment
  • hi guys, i did it and it works fine,

    but what i should do with the google.accessToken(), google.refreshToken(e){ e.token } ?

    what i need is to access the user profile picture and name , and give him ability to comment on youtube video , please help

    thanks

    — commented 4 months ago by Ebrahim Sayed

To logout from Google you need the below . I tried it and it worked fine on iOS 7 Titanium SDK 3.2.1 GA

logoutGooglebtn.addEventListener('click',function(){ Ti.App.Properties.removeProperty("GG_ACCESS_TOKEN"); Ti.Network.createHTTPClient().clearCookies('https://accounts.google.com/o/oauth2/'); });

Your Answer

Think you can help? Login to answer this question!