facebook redirect app from canvas page to fan page - facebook

im building facebook app as a iframe app in fan page. My problem at the moment is next: i added facebook request dialog (http://developers.facebook.com/docs/reference/dialogs/requests), and everything goes well except for one thing: when a user gets notification, the links goes to canvas page, not to fan page (where i would like to go...)
Since i cant convince facebook to add some funcionality (that would be great), im looking for a way to automaticly redirect from app canvas page to fan page, where this app is added as iframe tab.
I hope somebody understands what i want to do... :)
thanks, Peter

I also wanted to make sure that users view my Facebook app via a Facebook Page Tab (rather than via the Facebook App page or by directly viewing the actual site itself). I have managed to achieve it with this Javascript in a <script> tag in the head of my document (tested Mac/PC FF,Chrome,Opera,IE6-8,Safari).
<script type="text/javascript">
function NotInFacebookFrame() {
return top === self;
}
function ReferrerIsFacebookApp() {
if(document.referrer) {
return document.referrer.indexOf("apps.facebook.com") != -1;
}
return false;
}
if (NotInFacebookFrame() || ReferrerIsFacebookApp()) {
top.location.replace("http://permalink-to-my-facebook-page-tab");
}
</script>

If I understand you correctly, you can do this:
top.location.href='http://www.facebook.com/YOUR_PAGE_NAME?sk=app_YOUR_APP_ID'
or you can use a header to redirect to that url. This will redirect to the application's tab on your fan page.

My application is quite dynamic and I never know which page it's added to. So when I used URL 'http://www.facebook.com/YOUR_PAGE_NAME?sk=app_YOUR_APP_ID' it only redirected me to page, but not to application tab. What I do is:
1) I get page id from signed_request (the encrypted in base64url parameter that your app gets once someone comes to the page, so you have to decrypt it and pick id value from JSON page object)
2) Then I get page data from https://graph.facebook.com/PAGE_ID_YOUR_GET. You get JSON object with some page data in response in JSON format.
3) Only after point 2 I get 'link' value of page from response. It's like http://www.facebook.com/pages/Some-Page-Name
4) And finally I add '?sk=app_YOUR_APP_ID' to page link.
Maybe that's too complicated, but that's the only way it worked for me the way I expected (redirecting exactly to page application tab).

<script type="text/javascript">
function NotInFacebookFrame() {
return top === self;
}
function ReferrerIsFacebookApp() {
if(document.referrer) {
return document.referrer.indexOf("apps.facebook.com") == -1;
}
return false;
}
if (NotInFacebookFrame() || ReferrerIsFacebookApp()) {
top.location.replace("http://permalink-to-my-facebook-page-tab");
}
</script>

Related

Facebook apps: Redirect to canvas iframe to URL within app (not main app page)

I'm using the Facebook PHP SDK; setting up an app on Facebook.
I need the app to run within Canvas only, so if the user goes to this url, for example:
http://{site_url}/fbapp/index.php?this=that&that=this&etc=1
I want to:
a) redirect using javascript to the canvas page (ie. http://apps.facebook.com/appname/) and then
b) the iframe must go directly to the page within the app (ie. index.php?this=that&that=this&etc=1)
I've googled this to the moon but not getting anywhere!
Any ideas??
I've tried this:
var currlocation = location.href;
if ( window.self === window.top && !currlocation.match('facebook') ) {
location.href='https://www.facebook.com/dialog/oauth?client_id=<?= $facebook->getAppID() ?>&redirect_uri=<?= $site_url; ?>?<?= $_SERVER['QUERY_STRING']; ?>'; }
It results in an indefinite redirect loop between the site and facebook.
Instead of -
location.href='https://www.facebook.com/dialog/oauth?client_id=getAppID() ?>&redirect_uri=?';
Use-
header("Location: CANVAS_URL");
exit;

Facebook PHP SDK Capture Like Event

I need to record to the database if a user likes an iframe page tab using the official Facebook 'like' button at the top. I did a search here at stackoverflow and found a javascript snippet ...
FB.Event.subscribe('edge.create',
function(response) {
alert('You liked the URL: ' + response);
}
);
But it doesn't fire for the official button (only like buttons added to the page)? I declare it after FB.init and before FB.Canvas resize inside the asynchronous call. Is there a way in PHP to capture this - possible on refresh? Either JS or PHP is okay (since JS can simply ajax a php file). The signed request contains whether they like the page or not but I need to capture it as it happens (or just happened).
Any help greatly appreciated :-)
Try :
window.fbAsyncInit = function () {
FB.Event.subscribe('edge.create', function (targetUrl) {
_gaq.push(['_trackSocial', 'facebook', 'like', targetUrl]);
});
};
I think you just need to setup the subscript inside the fbAsyncInit.
Did it a purely PHP way in the end.
1: Get the signed request from facebook and extract the liked stats
2: Create a variable $liked and set to "yes" or "no" based on signed request value
3: Manipulate a session - use a session because the page gets refreshed when you "like" but the session remains (but the request value will have changed)
if(isset($_SESSION['likestatus'])){
if($_SESSION['likestatus'] == "no" && $liked == "yes"){
// do mysql updatestuff cause has liked page since session started
$_SESSION['likestatus'] = $liked;
}
else{
$_SESSION['likestatus'] = $liked;
}
}
else {
$_SESSION['likestatus'] = $liked;
}

Facebook share to refer back traffic to the iframe page tab

SO here's what I am after. I have a FB page tab that runs the content of the site https://site.com/
I set up a FB share link to share a page aboutus.html. When I share it FB allows me to share this URL https://site.com/aboutus.html, but how can i send the traffic directly to the iFrame on the page tab? For example https://www.facebook.com/fan_page/app_331267943480920398/whatever_aboutus.html
I know it is possible because I saw it one day - cant remember now where.
Thanks.
You can't pass in filenames this way, that's only supported on Canvas Apps.
The best workaround to replicate this is using the app_data parameter. Basically, have your landing page (as defined in your app settings), be some kind of server side script which listens to the Signed Request, specifically the app_data parameter. Then you have that script load content based on the contents of that.
So as an example, let's imagine I want to load http://mybasedomain.com/foo.php or http://mybasedomain.com/bar.php. I direct users to https://www.facebook.com/PAGENAME/app_APPID?app_data=foo or https://www.facebook.com/PAGENAME/app_APPID?app_data=bar, then on my landing page, I have a simple if/else statement to parse that and render the relevant content -
<?php
// Assumes you have this parse_signed_request function - https://gist.github.com/872837
// And a $config array, which contains your app_secret
$signed_request = parse_signed_request($_REQUEST['signed_request'], $config['AppSecret']);
if ($signed_request['app_data'] === 'foo') {
include('foo.html');
} else if ($signed_request['app_data'] === 'bar') {
include('bar.html');
} else {
include('index.html');
}

Redirect To my App if the app hosting site is visited

i want the codes which will redirect the user to my app if he/she tries to open my app hosting site.
for ex:
my app link: https://apps.facebook.com/gaming-zone/
app hosting link: http://gaming-zone.herokuapp.com/
i have found some codes already but those codes redirects the user continously and if he is using my app on facebook and he is playing any game then also it redirects the user to app home page.
i want the exact codes that redirect the user only when he visits my hosting site.
These are the codes that i found already:
<script type='text/javascript'>
if (window.top.location == window.location)
window.top.location = 'https://apps.facebook.com/gaming-zone/';
</script>
Here is the code that I use:
<script type="text/javascript">
function NotInFacebookFrame() {
return top === self;
}
function ReferrerIsFacebookApp() {
if(document.referrer) {
return document.referrer.indexOf("apps.facebook.com") != -1;
}
return false;
}
if (NotInFacebookFrame()) {
top.location.replace("https://apps.facebook.com/YOUR_APP_NAMESPACE");
}
</script>
This checks if they are currently in the Facebook frame and ONLY if they aren't it will redirect them to "https://apps.facebook.com/YOUR_APP_NAMESPACE"
Note: you can use this on any page in you app just change the URL accordingly.
For example: If you are using this in http://YourDomain.com/anotherpage.php you can change the URL in the code above to https://apps.facebook.com/YOUR_APP_NAMESPACE/anotherpage.php
The problem is that you cannot read the window.top.location value. You can only write it. Strange but thats it.
Option 1: Mount your app to a page tab and create a like-gate. Like gate will return false outside facebook iframe ALWAYS.
Option 2: Check signed request data when loading the page at backend.
Option 3: Other option is to examinate the top url as you do but at backend.

Why I cannot get facebook like my page?

What I want to do is user must like my page first then only can go to my facebook apps, but I have no idea why I cannot detect it and I had var_dump my page liked, result is NULL
here is my code
$request = $_REQUEST["signed_request"];
list($encoded_sig, $load) = explode('.', $request, 2);
$fbData = json_decode(base64_decode(strtr($load, '-_', '+/')), true);
var_dump($fbData["page"]["liked"]);// output is NULL
if (!empty($fbData["page"]["liked"]))
{
echo "This content is for Fans only!";
} else {
echo "Please click on the Like button to view this tab!";
}
Any idea how to do it?
Have you made sure there is as signed_request parameter?
It only gets transmitted to your app once the page is initially loaded into the Facebook iframe – it won’t be there anymore once you start navigating inside your app.
Best thing to do IMHO is to parse the signed_request if not empty, and safe the results into your own session.
Btw., parsing it yourself is rather time-consuming – I’d suggest using the PHP SDK and use Facebook::getSignedRequest() – that method gives you all the data in decoded form, if there was a signd_request parameter.
So here’s what I usually do:
if($signed_request_data = $Facebook->getSignedRequest()) {
$_SESSION['signed_request_data'] = $signed_request_data;
}
You can call that code on every page – only if the method actually returns data, your session gets updated.
You need the permission user_likes to check if they liked your Facebook App but $fbData["page"]["liked"] is referring to your Facebook App Page which is seperate.
To edit your App Page go to App Settings > Advanced > Near the bottom you will see App Page
To use the permission user_likes to check see this SO Answer On Detecting if a User Likes a Facebook App