Sunday 19 May 2013

Facebook: Check if user clicked Like page button(just liked the Facebook page)

Very often Facebook applications have "Fangate" page, meaning that if user hasn't liked the page and if he opened application - he can see application page with text something like "Please like our Facebook page before using the app" and can't use the application until he is not page fan.

Our clients as usual ask us to track how many users liked the page from the application.

Signed request contains an information about if user like a page:

$facebook = new Facebook(array(
    'appId' => $app_id,
    'secret' => $app_secret,
    'cookie' => true
));

$signed_request = $facebook->getSignedRequest();
$like_status = $signed_request["page"]["liked"];


So, the challenge is to catch the moment when user clicks like button.

The simples way is to store like status to the session. But it doesn't work in Safari, for iframe Facebook applications Safari doesn't accept cookies and user session is lost.

Nowadays most of polar browsers support local storage. So we can use it to store like status information. Example of source code is pretty simple.

This code example should be in template that is rendered if user is a fan of Facebook page:

<script type="text/javascript">
    if ('localStorage' in window && window['localStorage'] !== null) {
        if (localStorage.getItem('liked_state') == 0) {
            // we've go it: user just clicked like button
        }

        localStorage.setItem('liked_state', 1);
    }
</script>

Pretty simple, isn't it?