sundh.com » Facebook Connect

Post to Facebook with Javascript SDK

Ellen — Tue, 21 Dec 2010 12:55:12 +0000

Posting a message to someones wall can contain the following parameters:

var my_message = ‘This is just a test!’;

var url = ‘http://www.sundh.com/’;

var title = ‘This is the name of my post’;

var desc = ‘Optional description of my link’;

var picUrl = ‘http://www.sundh.com/blog/images/led.jpg’;

To post the following to my wall this javascript code is executed:

FB.api(‘/me/feed’, ‘post’, {message:my_message,link:url,name:title,picture:picUrl,description:desc },

function(response) {

if (!response || response.error) {

alert(‘Error occured’);

} else {

alert(‘Post ID: ‘ + response.id);

}

});

If I decided to not define the parameter “description” the post will grab the text appearing on the URL.

Youtube clip

Posting a YouTube clip to someone’s wall requires a little bit different code in order to be able to play the YouTube clip within Facebook. Note that the URL to the YouTube clip is different from the URL shown in the browser when you watch the clip. Instead of “http://www.youtube.com/watch?v=VIDEO_ID”, it is set to “http://www.youtube.com/v/VIDEO_ID”. The thumbnail of the YouTube clips is easly retreived by accesing the URL “http://img.youtube.com/vi/VIDEO_ID/0.jpg”.

var my_message = ‘My message here’;

var url = ‘http://www.youtube.com/v/VIDEO_ID’;

var title = ‘Title of YouTube clip’;

var desc = ‘Description of YouTube clip’;

var picUrl = ‘http://img.youtube.com/vi/VIDEO_ID/0.jpg’;

The trick that makes the YouTube clip embeddable on Facebook is to add the parameter “source” in you API call to Facebook. The source is the same as the URL to the video clip.

FB.api(‘/me/feed’, ‘post’, {message:my_message,link:url,name:title,picture:picUrl,source:url,description:desc }, function(response) {

      if (!response || response.error) {

        alert(‘Error occured’);

      } else {

        alert(‘Post ID: ‘ + response.id);

      }

    });

The result looks like this:

Facebook Connect: Only for grown ups

Ellen — Sat, 06 Feb 2010 12:03:45 +0000

In some Facebook Connect apps you might want to target an older audience. Any Facebook user is required to fill in their date of birth so the birthday field of the profile can be a way to check that your user has the appriopriate age for your application. This can be done by checking the birthday date of the user (birthday_date) using the function

users_getInfo($uid, ‘birthday_date’).

Important to remember though is that if the Facebook user has chosen not to show the birth year, this will not be available for the Facebook Connect application. To determine that the Facebook user has the appropriate age her settings on Facebook must look as follows:

Facebook Connect: No server-side needed

Ellen — Fri, 15 Jan 2010 16:27:44 +0000

With the Facebook Connect API comes javascript functionality. This means no server-side scripting needed. You can create your application on Facebook and connect to it from your website thought javascript. Use the API Key and Secret Key to connect to you application. Make sure your callback URL is set on Facebook to be the URL of the page you are connecting from.

Create your customized Facebook Connect login button through this wizard. Paste in the code into your site.

Enabling calls to the javascript API on Facebook:

Generating the login button on your site:

The Facebook Connect login will appear in a pop-up window. When successfully logged in, the window closes and your main page reloads.

The output
In the Javascript function FB.ensureInit you can then put in your API calls and generate your HTML from that. Below is an example of showing selected information from a user’s profile.

Add Facebook Connect to your blog comments

Ellen — Tue, 15 Dec 2009 10:09:08 +0000

This neat video explains how you can add Facebook Connect to your blog and let users add comments by logging into Facebook Connect! No server-side scripting needed!