如果无法访问互联网，则显示静态图像

I am working on a college website. I'm using a Facebook plugin to show the likes of a Facebook page by using this:

<iframe src="//www.facebook.com/plugins/likebox.php?href=https%3A%2F%2Fwww.facebook.com%2Fpcclahore&amp;width=364&amp;height=220&amp;show_faces=true&amp;colorscheme=light&amp;stream=false&amp;border_color&amp;header=true" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:364px; height:220px;" allowTransparency="true"></iframe>

The problem is that Facebook is blocked on the college servers, so nothing appears except a warning. Is it possible to show a static image instead of Facebook plugin while the internet not available (localhost) or Facebook not accessible? Like this:

if(Facebook accessible)
show Facebook pluging
else
<img src="images/fb.jpg" width="364" height="220">

// check if local server is HTTPS if so check Facebook HTTPS
$remote = ('80' !== $_SERVER['SERVER_PORT'])
    ? array('host' => 'ssl://www.facebook.com', 'port' => 443)  // HTTPS Facebook
    : array('host' => 'www.facebook.com', 'port' => 80);        // HTTP Facebook

$fp = @ fsockopen($remote['host'], $remote['port'], $errno, $errstr, 5);

echo (!$fp) // check if failed
    ? '<img src="images/fb.jpg" width="364" height="220">' // output local image
    : '<iframe src="//www.facebook.com/plugins/likebox.php?href=https%3A%2F%2Fwww.facebook.com%2Fpcclahore&amp;width=364&amp;height=220&amp;show_faces=true&amp;colorscheme=light&amp;stream=false&amp;border_color&amp;header=true" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:364px; height:220px;" allowTransparency="true"></iframe>'; // output IFRAME

You can check if facebook is available by fsockopen function of php.

ie,

   $check = fsockopen("www.facebook.com", 80, "error_no", "error_message", timeout in seconds);

    if (!$check) {

    //iframe

    } else {

   echo "<img src='images/fb.jpg' width='364' height='220'>"

    }

I didnt checked it works or not. Try it.

You may try to ping the site first. If the result is positive show plugin else display a static image. set domain to facebook.com

 function pingDomain($domain){
   $file      = fsockopen ($domain, 80, $errno, $errstr, 10);
   $status    = 0;

   if (!$file) $status = -1;  // show static image
   else {
   //show plugin
   }

 }

You have to use client-side JavaScript for this rather than server-side code. JavaScript allows you to check whether images can load successfully, so you could try using it to check whether Facebook is reachable by attempting to load an image from www.facebook.com (test page):

var testImg = new Image();

testImg.onload = function() {
  alert('facebook REACHABLE');
};

testImg.onerror = function() {
  alert('facebook UNREACHABLE');
};

testImg.src = '//www.facebook.com/images/fb_logo_small.png?' + new Date().getTime();

Then you can set the src attribute of your iframe accordingly.

You can alternatively put onerror on the iframe itself (and not use a separate test image); however, this will not work the college's content filtering system does not return an HTTP status indicating an error.