Using Oauth In Sencha Touch 2 To Connect Facebook

Aren't there any functions/libraries provided by sencha touch 2 to connect with facebook. I am clue less so far now Can we use facebook javascript sdk inside sencha touch ? I have

Solution 1:

Depends how you want to connect I guess. For me, I just needed to connect and display the wall posts of a facebook page to display on my iPad. The way I have done it is as follows: Login to facebook developers and create an app. Give it a name e.g. Senchatouch App. It will generate an appID and secret key.

You then need to find your facebook username id by querying this link:

https://graph.facebook.com/[username]

Once you have that then you have to go to the Facebook Graph API explorer and type that ID in and you can see an example response.

Then you need to append the access token to this link:

https://graph.facebook.com/51539791474/feed?access_token=ACCESS_TOKEN

so you have something like:

https://graph.facebook.com/51539791474/feed?access_token=AAAFnhgQ0ZAHIBAAbiopuvZAa8zlEmRyxKtZBTcgspJIJ21tVwI17xZCJEbgtNRaMUCnGBVwUa1zE7s6ZBRzg6rJ5UGIEBhZAQfMsCrrT0GVQZDZD

This is the link you can use in a normal JSONP proxy in sencha touch 2.

My store code:

Ext.define('TCApp.store.Facebook', {
extend: 'Ext.data.Store',
requires: [
    'TCApp.model.Facebook'
],

config: {
    autoLoad: true,
    model: 'TCApp.model.Facebook',
    storeId: 'Facebook',
    proxy: {
        type: 'jsonp',
        url: 'https://graph.facebook.com/51539791474/feed?access_token=AAACEdEose0cBAAJt7hcZCdkHHK8hOjZBDFd8GSfg2xkI6hj5AghswWn7MvBTz4B4xooN4t2fXvMmTZCrxAq4t5ofnnPIY7oZBebnbuB5wQZDZD',
        reader: {
            type: 'json',
            rootProperty: 'data'
        }
    }
}
});

and my model:

Ext.define('TCApp.model.Facebook', {
extend: 'Ext.data.Model',
config: {
    fields: [
        {
            name: 'message'
        },
        {
            name: 'picture'
        },
        {
            name: 'link'
        },
        {
            name: 'description'
        }
    ]
}
});

I then bind this to a simple list using this itemTpl:

'<div class="wholeitem"><img src="{picture}" class="facebookthumb" />{message}</div>',
    '<div class="smalltext">{description}</div></div>',

The only problem I am having is the expiry, it seems each access token has an expiry of 2 hours. I haven't worked out how to extend it yet, if you find out please post the solution or link to it. Thanks

:-)