如何检测Facebook应用程序正在加载页面以更改CSS？

Question

Facebook iframes are 758px wide. The website is 900px wide.

Is there any way to tell that apps.facebook.com is pulling in the page so I can change the styles to make the page narrower?

Answer 1

if($_SERVER['HTTP_REFERER'] == "http://apps.facebook.com/forwardmyinfo/"){
    do something
}

EDIT:

So here is the problem fleshed out a bit more (which I discovered later) and the solution.

When an app is loaded into the facebook iframe if your page is wider than facebook's standard iframe width (758px?) your page is going to hang off the right of the iframe.

My answer above will most certainly detect that you are loading my facebook app (assuming it is http://apps.facebook.com/forwardmyinfo/ ), but only on your landing page. Once you click within the site - which is all an app really is, it sees the referrer as being the site...not facebook.

My solution was on loading the home page to change the style sheet, but more importantly, set a session variable that can be tested on other pages :

if($_SERVER['HTTP_REFERER'] == "http://apps.facebook.com/forwardmyinfo/"){
    echo '<link href="includes/facebook.css" rel="stylesheet" type="text/css" media="Screen"/>';
    $_SESSION["FB"] = true;
    //do other stuff if needed
}
else{
    //load original style sheet or whatever
}

The rest is obvious, but here it is anyway:

On every other page include this code:

if($_SESSION["FB"]){
    echo '<link href="includes/facebook.css" rel="stylesheet" type="text/css" media="Screen"/>';
    //do other stuff if needed
}
else{
    //load original style sheet
}

Don't forget you are also going to need session_start() on each page.

Hope that helps someone.

ifaour's ssuggestion of:

if( isset($_REQUEST['signed_request']) )

may also work, but I am not sure if the variable is passed from page to page so it wouldn't carry through the site. It does warrant testing for sure, but I am happy with my result.

Answer 2

There's the complicated way, and the easy way.

The easy way is simply tell your page the link comes from facebook by giving facebook a unique URL.

http://server/page?source=Facebook

Then check your _GET scope.

That's also going to help with logging.

Answer 3

A simple and reliable way would be to set an get parameter. If the url of your page is

htttp://whatever.com/page.php

Make facebook link to

htttp://whatever.com/page.php?ref=facebook

On session start you can test if this was set.

if(@$_GET['ref']){
  if($_GET['ref']=='facebook'){
  //change display
  }
}

Using a relative layout without fixed pixel size would be the better option.

Answer 4

Or use the standard way of doing this!

Facebook will always send you the signed_request :

if( isset($_REQUEST['signed_request']) )