CODEWITHSUNDEEP
javascriptfacebook-iframe
ali
ali

Reputation: 21

how to check content of Iframe from external url

I wanna use Facebook's Like button on my web site.

It's so simple as everyone knows but I have a problem with the censorship in our country. Facebook is censored in our country and if I use the simple iframe, the people who have no access to Facebook (can't pass the censorship) will see the block page which I don't want to.

So I wanna check if loaded address is Facebook show them the iframe else (they will be redirected to another web site) hide the iframe.

Is there any way for me to find this out? I mean anything like address or content or id etc.

Here is my code:

<html>
    <head>
    <title>facebook test</title>
    <style>
    .facebook{
        display:none;
        }
    </style> 
    <script type="text/javascript" src="jquery.js"></script>

    </head>
    <script type="text/javascript">
    $.ajax({
        url: 'https://graph.facebook.com/btaylor?callback=?',
        dataType: 'json',
        success: function(data) {
            $(".faceboock").show();
           // alert('success - facebook works');
           // alert('data = ' + JSON.stringify(data));
        },
        error: function() {
            alert('error - facebook fails');
        }
    });
    </script>

    <div class="faceboock">
    <iframe src="http://www.facebook.com/plugins/likebox.php?href=http%3A%2F%2Fwww.facebook.com%2Fpages%2Fmypage%2F152215541478267&amp;width=292&amp;colorscheme=light&amp;show_faces=true&amp;stream=true&amp;header=true&amp;height=427" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:292px; height:427px;" allowTransparency="true"></iframe>
    </div>

It works when client has access to facebook, I mean the "success: function" works but error function doesn't.

The problem is when facebook is not accessible that json never responds.

Is there any way to set a timeout for response or anything else in order to handle the error?

Upvotes: 2

Views: 3043

Answers (1)

Dan Manastireanu
Dan Manastireanu

Reputation: 1822

You can't check the content of an iframe that is not on the same domain as your code.

See Same Origin Policy

  • iframe.src can be checked without restrictions, but does not change when the redirect happens
  • iframe.contentWindow.location.href does change when the redirect happens, but can't be accessed in your case due to the security restrictions mentioned above

The only way I can think of to test this is:

  1. Do a JSONP call to one of the Facebook APIs (JSONP has no domain restrictions)
  2. Check the response
    If these JSONP calls get redirected as well than it will most likely throw an exception instead of returning the expected values (due to the fact that it will try to parse as javascript a response which is most likely a fullhtml page)

Here is a working example using jQuery to do the JSONP call.
It works from my location, could you test it and see if you get the error alert?
You can also go in your browser to the url in the example. If facebook.com gets redirected, but this one doesn't than you'll have to find some other way to check it...

Upvotes: 1

Related Questions