Tizen Developers

Hi Govind,

For Tizen Mobile try https://developers.google.com/accounts/docs/OAuth2ForDevices, inside of web application since you cannot specify the redirect url since mobile app is not a hosted application.

Hi Govind,

   The method mentioned for device, requires the user to login into their account with the device code and authenticate the app. The easiest way i would say to use is, going with opening another child window using window.open() and monitor the url untill you get the access token. As you can see, once the user provide access to the app you will be redirected to an confirmation page of google. Evaluate the page and retrieve your access token from the url.

Steps to implementation

• Get the device code in the device by making call to the service.
• Open the authentication url in child window using window.open()
• Place the device code in its text box once the user login to their account (URL monitoring required)
• User will be displayed with allow access page (allow or deny)
• Monitor the url to get the access code (Check the page for confirmation message or indicator)

Difficulties in implementation

• User have access to navigate to other pages in the process(child window) as you are opening google page which is not in your control

The pages are maintained in stack. so the app page will be retained when the child window is open. When the child window is closed the page from app will be resumed.

Hii Aries,

I was trying the same using IFrame and it lauched external window and handle lost but didn't try with window.open. I will try this and let you know if I can handle the window inside time. If you have some sample code please share here and it will be useful for many people.

Thanks,

Govind

Hi Govind

Try this code(facebook)

Html

Login Page:

<div data-role="page" id="Loginpage">

  <div id="content_id" >
        </div> 
        <input type="button" id="btn_id1" value="Login" onclick="Login();">
        </div> 

menu page:

<div data-role="page" id="menupage">

main.js

//This will give secure code

$.ajax({
        type : "GET",
        //data : strQuery,
        //dataType : 'json',
        url :'https://graph.facebook.com/oauth/device?type=device_code&client_id='yourclientid'',
        success : function(data) {
            console.log("inside success");
            try {
                $('#content_id').empty();
                var usercode='<font color="white"><p>Please note down the code <b>'+ data.user_code+'<b> and enter it in the text box after entering login credentials</p></font>' ;
                user_code=data.user_code;
                console.log(data.user_code);
                code=data.code;
                console.log(code);
                $('#content_id').append(usercode);
                
            } catch (e) {
                console.log("inside exception");
                //callbacks.error("Unable to authenticate!");
            }
        },
        error : function() {
            console.log("error")
            //callbacks.error("Unable to authenticate!");
        }
});    

//Login function

function Login(){
    console.log("inside login");
    var appControl = new tizen.ApplicationControl("http://tizen.org/appcontrol/operation/view", "https:\/\/www.facebook.com\/device", null, null);
    tizen.application.launchAppControl(
    appControl,
    "tizen.internet",
    function() {
    console.log("launch application control succeed"); 
    document.addEventListener("webkitvisibilitychange", handleVisibilityChange, false); //webkit visibility
    },
    function(e) {console.log("launch application control failed. reason: " + e.message); },
    null );
   
}
function handleVisibilityChange(){
    console.log("visibility change");
    setTimeout(function(){
    $.ajax({
        type : "GET",
        dataType : 'json',
        url :'https://graph.facebook.com/oauth/device?type=device_token&client_id=yourclientid&code='+code,
        success : function(data) {
                    console.log("inside login success");
                    try {
                        accesstoken=data.access_token;
                        console.log("accesstoken is" +accesstoken);
                        $.mobile.changePage("#menupage");
                        }
                         catch (e) {
                                console.log(e);
                    }
        },
        error : function() {
                    $.mobile.changePage("#Loginpage");
                    console.log("acess token error")
        }
});    
    },10);
}

Hi,

Thanks for the code samples . But the OAuth from eventbrite http://developer.eventbrite.com/doc/authentication/oauth2/ has no support for device code and the only way I can do with Tizen is to launch the external app (browser) and monitor the URL if its redirected to redirect uri. then kill the browser and use the token. But it always opens up the external window  and after that it detaches from main app window.

Thanks,

Govind

Note: When I tried with Modal Dialog using IFrame, Window.open, and external page everything working fine. After deployd to Tizen Developer device it doen't work.

Hi 

Will you please share the code for url monitoring

This is using window.Open , same logic can be followed for Iframe too.

 authenticate: function (e) {
        e.preventDefault();
        window.authCount = 0;
        window.authWin = window.open(oauthurl, "blank", "", true);
        this.watchOAuth();
        return;
    },

 watchOAuth: function () {
        window.int = self.setInterval(function () {
            window.authCount = window.authCount + 1;
            console.log(window.authWin);
            if (window.authWin && window.authWin.location) {
                var currentURL = window.authWin.location.href;
                var inCallback = currentURL.indexOf("token_type");
                if (inCallback >= 0) {
                    window.clearInterval(int)
                    window.authWin.close();
                    var authData = currentURL.substr(currentURL.indexOf("#"));
                    alert('Authenticated' + authData);
                   // process here                      
                }
            }
            if (window.authCount > 60) {
                alert('30 seconds time out');
        window.authCount  =0;
                window.clearInterval(int)
                window.authWin.close();
            }
        }, 500);
    },

Hi Govind,

As per your code i am getting location as "file:///opt/usr/apps/2AMEzrYSBu/res/wgt/index.html#Loginpage" its not showing the url launched using "window.open()"

I guess I could have posted with more information.

here oathurl is a full url of Oauth server with all the information and you are launching this code from your OAuth connect step. 

https://www.XXXXX.com/oauth/authorize?response_type=token&client_id=XXXXXXXXXX&redirect_uri=http://localhost/eventbytes/authhandler.html

Thanks,

Govind

Hi Lakshmi,

I guess this will work for Google OAuth and not compatible with all OAuth providers.  For Example http://developer.eventbrite.com/doc/authentication/oauth2/ this one doen't have similar capabilities.

Thanks,

Govind

Hi Govind,

Yes you are right, but for Mobile standalone application we cannot specify redirect_url, then we should go for web hosted applications

Does Tizen have a plan to implement a app url feature(such as myapp:// )  to redirect? For example, Tizen 3.0?

Hi.

>Link: http://developer.bada.com/documentation/docView.do

The url seems invalid.

Yeah, sorry. That will work http://developer.bada.com/library/BadaFaceBook-A-minimal-Facebook-Sample-App