Tuesday, April 3, 2012

How to detect when Facebook is blocked.

I recently had an issue with a customer's site that when a client computer accessed their web site, and the client computer was also blocked from accessing Facebook, then a great big ugly error message was displayed on my customer's web site.  A really educated user might understand that Facebook is blocked, so it will affect the look and feel of the site they are using.  However, most users will probably attribute the error message to the client site, not to a problem with Facebook.  So, I crafted this little snippet of JavaScript to find out if the client had access to Facebook so I could hide the offensive warning as needed.

       

<script  language="JavaScript" type="text/javascript">

window.onload = DetectFB;

function DetectFB() {
var fbdetect = new Image();
fbdetect.onerror = function () {
    //FB is blocked
 document.getElementById('fb-root').style.display='none';

}
fbdetect.onload = function () {
    //FB is not blocked
}

fbdetect.src = "http://facebook.com/favicon.ico?"+Math.random();
}

</script>

       
 

Hope this helps save someone from an ugly proxy error message somewhere.