i am trying to develop an app using sencha touch. Is it possible to integrate facebook into the app? Any sample code would be appreciate.
Thanks
Sencha is a HTML5 framework with mobile event integration. I don't think there is anything in Sencha that allows you to work better with Facebook, I could be wrong, but saying that I would look into http://touch.facebook.com/#!/home.php , it's Facebooks better integrated touch site designed to work with tablets. You may want to integrate to this functionality when working with the framework.
Facebook also has the original mobile site at m.facebook.com
It depends how you want to integrate it I guess, here is how I do it using JSONP. If you sign up for facebook developers and create an app, give it a name and you will be given an App ID and secret key. If you then head over to tools, Graph API explorer you can type in your Facebook page ID number e.g. 509796964 to get an example query. You can find your ID in several ways, just google around a bit.
You will see an access token given at the top. You can then append this to your URL just like any other JSONP call in Sencha, and you will get back results that you can tie to components (for example, I have tied my response to a list).
Here is an example list view:
Ext.define('TCApp.view.FacebookList', {
extend: 'Ext.dataview.List',
requires: [
'Ext.plugin.PullRefresh'
],
alias: 'widget.facebooklist',
config: {
loadingText: 'Loading Movies...',
plugins: [
{ type: 'pullrefresh' }
],
store: 'Facebook',
itemTpl: [
'<div class="wholeitem"><img src="{picture}" class="facebookthumb" />{message}</div>',
'<div class="smalltext">{description}</div></div>',
]
}
});
my store:
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=AAAFnhgQ0ZAHIBAO0s9iDUGZAIomBGmLJgpvSE03FmMNSPZAXo35wNKWa0ul0L8Twb9fLsssJTXO0BwthCck5MGViQxbDm0laido30OoYwZDZD',
reader: {
type: 'json',
rootProperty: 'data'
}
}
}
});
You have to change the end of the URL token to your own, and it will work, just remember to create a model too with the items you want in your list, for example I have image, text, description and link.
The only thing I can't work out so far is that this access token expires after 2 weeks!!! If you can work out how to request a new token each time it would be awesome, but best in another question I think!
:-)
I haven't try this yet but I guess you will get problem when implement this in a packaged app.
Btw, others say that they succeeded with https://github.com/mgcrea/cordova-facebook-connect/
I'll try both solutions and figure it out soon. But this question is old, I don't know if you still need my answer.
Good luck!
Related
I have implemented payments in my Unity app and have defined products in HTML form in my server, and have crawled them with FB's debug tool. The products are identical to Facebook's payments example apart from pricing and naming, as well as the photo link.
Yet, when I run FB.Canvas.Buy after deploying the app to Canvas, I get the following error:
An error occurred. Please try again later.
API Error Code: 1383146
API Error Description: invalid og type. Expected og:product, got website
This error has no documentation I can seem to find on any search engine or on Facebook's own documentation.
Any help would be appreciated, thank you.
I found the problem was I was passing the actual URL of the HTML product into the pay dialog rather than the graph object ID.
When using the graph object ID, I am finally able to perform purchases.
I meet the same error code 1383146 and found the root cause.
In the beginning i expect the product URL will be my current URL plus product.html. For example. My page is https://a.b.c/def/ and i expect FB to parse my product page https://a.b.c/def/product.html
var productURL = window.location.href + 'product.html';
var obj = {
method: 'pay',
action: 'purchaseitem',
product: productURL
};
FB.ui(obj, function(data) {
...
});
But i found FB will add query string when POST to my canvas page URL in some cases. URL will become https://a.b.c/def/?fb_source=search&ref=ts&fref=ts. Then my code will be wrong because i use window.location.href. So i update code and never meet 1383146 issue.
var productURL = window.location.protocol + "//" + window.location.host + window.location.pathname + 'product.html';
var obj = {
method: 'pay',
action: 'purchaseitem',
product: productURL
};
FB.ui(obj, function(data) {
...
});
In my case, the Facebook scraper could not reach the web server that is hosting the products (it could only be reached from our office, which I did not know). In that case, Facebook constructs a default object of type website and then complains about that.
You can see this in action with the Facebook Sharing Debugger. Enter your product URL, and hit the 'Debug' and maybe 'Scrape Again' buttons. It will show 'Warnings That Should Be Fixed'. It will only show the first warning by default, make sure you show all warnings. For me, one of those warnings further down was 'Cannot Connect To Server'. So that was the REAL problem
I want to post to user time-line with their current activity with photo uploaded by them.
For example:
I voted 'xyz movie'.
..image1.. ..image2.. ..image3..
Question : Mutiple photos possible? If yes, Is there limit of photos.I need to show 3-5 photos
Similar to Candy crush saga game post:
(just for reference,not exactly like this. For curiosity I wanted to know whether this is two posts?)
Which api can we use for this?
Is this possible with FB.ui feed api?
FB.ui(
{
method: 'feed',
to:'the Facebook ID of the person you wanna send',
name: 'Facebook Dialogs',
link: 'http://emplido.com',
picture: 'http://fbrell.com/f8.jpg',
caption: 'Reference Documentation',
description: 'Dialogs provide a simple, consistent interface for applications to interface with users.'
},
function(response) {
if (response && response.post_id) {
alert('Post was published.');
} else {
alert('Post was not published.');
}
}
);
What you want is called rich stories, you can create them with open graph, here you can see what are the options available.
This is no easy deal, since you have a lot of options, so you really need to read the open graph docs to find which action fits best. In the docs you have a complete "how to", including how to post an action on a users wall with graph api https://developers.facebook.com/docs/opengraph/using-actions/
Remember that you have to two types of actions, common (docs here) and custom (docs here)
I know that documentation isn't the best answer or the one you wanted to, but in this case it's really necessary, as I said before, you have too many options, that allows you to create the best user experience for your app.
Quoting the docs here's a little example on how to create a story with open graph
To publish an action, make an HTTP POST to the following Graph API endpoint:
/{user-id}/{action-type}
This call should be signed with a user access token with
publish_actions permission or with an app access token for a user who was previously logged in.
For common actions, the {action-type} is the name of the action, such as og.likes:
/{user-id}/og.likes
For custom actions, it is a composite of the app namespace and the custom action type:
/{user-id}/{namespace}:{action-type-name}
The namespace is unique to your app, and is set in your app's dashboard on the Basic tab.
This example is the simplest one.
I'm using Sitecore Social Connect to log users into my website using Facebook & Twitter. Sitecore's documentation has detailed instructions on how to post to a user's timeline using Marketing Goals, but I'm wondering if there's another way to do this. Is it something I can do directly through the API? Pretty much any other options would be worth exploring. There's not a ton of documentation around this.
Social connected messages must be associated with either content items or marketing goals, but it is possible to trigger a marketing goal using the API:
GoalUtil.RegisterEventParameters("Goal Name", new Dictionary<string,string>());
This fires the goal, and has the additional feature of allowing you to replace tokens in the message text. For example, if you defined a Goal named "Mayor", and create an associated Facebook message with this text: "I've just become mayor of $place.", you can cause this to appear on a user's Facebook wall specific text by doing this:
var tokens = new Dictionary<string, string>();
tokens.Add("place", "New York");
GoalUtil.RegisterEventParameters("Mayor", tokens);
This message will appear on the users wall: "I've just become mayor of New York." Notice that the dollar sign appears in the message, but not in the token key value added to the dictionary. GoalUtil is in the namespace: Sitecore.Social.Core.Publishing.Utils, in the Sitecore.Social.Core.dll.
In addition, when a message is associated with a goal, the following rule is added to the goal:
where true (actions always execute)
post associated messages
You can replace the always true condition with different logic, possibly using Rules Engine conditions you have authored, to restrict messages to meet the required business logic.
We used the facebook js API itself to achieve this:
<script type="text/javascript" src="http://connect.facebook.net/en_US/all.js"></script>
<script type="text/javascript">
var facebookAppId = '<%=FacebookDefaultAppId %>';
FB.init({ appId: facebookAppId, status: true, cookie: true, xfbml: true });
function openFbPopUp() {
FB.ui({
method: 'feed',
name: 'Your Site Name',
caption: ' ',
link: document.URL, // Current Url
description: $('#quotes').html(),
// Description from the sitecore item which was available in the same page
display: 'popup'
});
return false;
}
</script>
FacebookDefaultAppId - was the app id (Application Id) set in the sitecore item where we set the facebook app details:
Which we get here in facebook for the app created:
Truth be told, this solution has nothing to do with sitecore, but since we manage the app secret key in sitecore, I am pulling it in from there as opposed to saving it some place else too.
This results in the following when the js is triggered (say on button click):
Sitecore Social Connected API was introduced in the 1.3.1 version. The API documentation is available here: http://sdn.sitecore.net/Products/Social%20Connected%20Module/Social%20Connected%201,-d-,3/Documentation.aspx
As of last night, facebook seems to be automatically popping up a captcha for any stream post from my application. This is for stream posts to my own wall as well as my friends wall. All of the stream posts link back to http://apps.facebook.com/fortyhumans with some addition params for analytics tracking. So I do not believe I am violating the requirement that links must point to the app canvas or website url.
I'm using the following code to do the post.
FB.ui(
{
method: 'stream.publish',
message: '',
attachment: {
name: sName,
caption: sCaption,
description: (sDescription),
href: sHrefLink,
media: [{'type':'image', 'src':sImgSrc, 'href':sHrefLink}]
},
action_links: [
{ text: sHrefTitle, href: sHrefLink }
],
user_prompt_message: sUserPrompt
},
Is there any way to avoid this captcha from popping up? Should I be posting using a different api? The user experience with captchas is very poor. Even posting to my own wall pops up a captcha.
I've read in previous posts here that some people changed to using a bit.ly url or something similar. But that would seem to violate the requirement that links in stream posts must point to canvas or website url.
Any help would be appreciated, or if this is not the right place then where should a question like this be posted.
I don't use Facebook, so at a bit of a loss here, as the API documentation doesn't quite answer this, perhaps someone here knows...
Looking at building a Facebook app to assist publishing from a content-driven web app. Obviously we need authorisation via OAuth to publish an app link to a facebook user's wall, but is authorization for everyone viewing the app within Facebook required? We have no interest in making use of the viewer's facebook data, we just want to show them a page.
If they have to authorise the app, then that's a bit of a barrier - but it's not clear if they can just view the app without anything getting in the way.
"is authorization for everyone viewing the app within Facebook required?"
If you mean having your app post a link to their wall, then yes, you will need to ask for their permission to do so. If you mean can other friends can see the post made by your app to an authorized user's feed? No the friends do not need to authorize your app to do that.
But remember Facebook now has the ability for you to specify which groups can see the post. See https://developers.facebook.com/docs/reference/api/user/#posts and read about the privacy field.
Yes, you can show app without any authentication. If you want user to share content then you can do it like this. Code is few months old, so I don't know if that works.
You cannot set custom text/message for the user. This will display popup window where user must confirm sharing/posting to wall.
<div id="fb-root"></div>
<script src='http://connect.facebook.net/en_US/all.js'></script>
<script type="text/javascript">
FB.init({appId: 'APP_ID', status: true, cookie: true});
function share(object) {
var obj = {
method: 'feed',
link: 'http://apps.facebook.com/your_app_url/',
picture: object.picture,
name: object.name,
caption: object.caption,
description: object.description,
action_links: [
{ text: 'My Cool App', href: 'http://apps.facebook.com/your_app_url/' }
]
};
function callback(response) {
}
FB.ui(obj, callback);
}
</script>
If you're doing a canvas app, you don't need to. You get this generic information in the initial HTTP post:
user A JSON array containing the locale string, country string and the age object (containing the min and max numbers of the age range) for the current user.
algorithm A JSON string containing the mechanism used to sign the request.
issued_at A JSON number containing the Unix timestamp when the request was signed.
You get no actual information about the user, though. You need to authenticate to get that.