FBJS and Ajax to acheive Facebook profile link tracking
In interactive application development we love our ability to track and analyze the behavior of our users. Through tools like Google analytics and Urchin, web sites can monitor and analyze where their users are going, and more importantly how those users are getting there.
As our company delves deeper into creating applications for the Facebook platform, we have realized that analysis of users behavior is extremely important. It is no secret that very few companies have mastered how to create a success Facebook application. Those that have seen moderate success do one thing consistently, they all leverage the social graph, but outside of that there is no clear blue print to success. Using techniques such as user tracking we can begin to tune the way a Facebook applications evolves as a way to change its presentation based on the behaviors of its users.
Integrating analytics into a canvas view it is pretty simple, slap in some Google analytics and you can begin to monitor and tune user traffic. The profile view is much more challenging. In the profile view an applications FBML and images are cached and delivered from a Facebook server. Using traditional Google analytics in the profile is not possible. I hope someday Facebook will show us how many users view and interact with a users profile, but until then we need some way to track a users interaction with our application. Back in October Facebook gave developers the ability to do some restricted Javascript and Ajax. With these two features, we can begin to track what links a user click and how those clicks relate to a users interaction with the canvas view. The following snip of FBJS will post a small JSON array to a external location, which in turn will asynchronously store that data for later analysis.
<pre line="1" lang="javascript">
<script><!-- var uid = '111111'; function track(pid, method) { // ajax query var ajax = new Ajax(); ajax.responseType = Ajax.RAW; ajax.requireLogin = false; var queryParams = { "pid" : pid, "method" : method, "uid": uid, "source": "profile"}; ajax.post("http://url.com/tracker.ashx", queryParams); }//--></script></pre>
To enable this tracking we must add the following callback attached to that elements onclick event. In our example we are attaching tracking to a link which provides an external vendors affiliate link for a series of consumer products.
<pre line="1" lang="javascript">
<a href="http://www.amazon.com" onclick="track(12345,'buy'); return true;" class="buy">BUY</a>
</pre>
On the back end we have a page that is waiting for this specific Ajax post, and will return a 1 for success and a 0 for failure. It is extremely important to keep this tracking as efficient as possible. Facebook Ajax has a <10 second maximum timeout on all requests. In our design, the storing of the data is done using a asynchronous thread that queues up the incoming requests in hoped to avoid Facebook having to wait for us to store the data correctly.
|
Why every guy should buy their girlfriend Wii Fit.
Gratuitous...
|
|
Astronomy Picture Of The Day
This picture makes us feel very very small.
|
|
Hottest Girl Superhero List
A list of female video-game characters you should check out.
|










