What I am having problem is that when a user first time login to this facebook iframe app then he is sent to a blank page with a facebook logo. Followin is screen shot.
Following is my code, I am using new PHP Sdk:
$facebook = new Facebook(array(
'appId' => 'xxxxxxxxx',
'secret' => 'xxxxxxxxxxxxxxxxxxxxxxxxxxxxx',
'cookie' => true,
));
$this->facebook=$facebook;
$this->session = $facebook->getSession();
$this->me = null;
// Session based API call.
if(!$this->session){
if (!$this->session) {
//echo $loginUrl = $facebook->getLoginUrl($par);
$loginUrl = $facebook->getLoginUrl(
array(
'canvas' => 1,
'fbconnect' => 0,
'display' => 'page',
'req_perms' => 'email,publish_stream,status_update,user_birthday,user_location,user_work_history'
));
$this->request->redirect($loginUrl);
}
}
if ($this->session) {
try {
$this->uid = $facebook->getUser();
$this->user = $facebook->api('/me');
} catch (FacebookApiException $e) {
error_log($e);
}
}
don't redirect to the loginUrl, what you are essentially doing is making your iframe goto a facebook page resulting in facebook in an iframe of facebook. and facebook does not display inside an iframe. so the auth page is not shown.
you need to do a top level redirect. basically redirecting the entire page, not just your iframe. one way to do top level redirect from inside an iframe is to show the following javascript:
<html><head>
<script type="text/javascript">
window.top.location.href = "<your redirect url here>";
</script>
<noscript>
<meta http-equiv="refresh" content="0;url=<your redirect url here>" />
<meta http-equiv="window-target" content="_top" />
</noscript>
</head></html>
Related
i have created a facebook app and it works well for new users if they start the app with the direct server link (https://www.mydomain.com/app/index.php) and use the login button.
But if they try to use the app within facebook (https://apps.facebook.com/myapp) as a canvas app(for the first time) then they see the "landing" page of my app and the log in button. But if they click on it, an errormessage appears, that the content of the iframe couldn't be displayed. If they start the app in a new tab, then the login process works. (see the error below, sorry it's german, maybe you are familiar with this type of error message?)
It would be desirable if the new user could use the login link in the canvas app.
How can this be achieved? My index.php looks like this: (i am using the facebook SDK)
<?php
require_once('php-sdk/facebook.php');
$config = array(
'appId' => 'YOUR_APP_ID',
'secret' => 'YOUR_APP_SECRET',
);
$facebook = new Facebook($config);
$user_id = $facebook->getUser();
?>
<html>
<head></head>
<body>
<?php
if($user_id) {
try {
$user_profile = $facebook->api('/me','GET');
echo "Name: " . $user_profile['name'];
} catch(FacebookApiException $e) {
$login_url = $facebook->getLoginUrl();
echo 'Please login.';
error_log($e->getType());
error_log($e->getMessage());
}
} else {
$login_url = $facebook->getLoginUrl();
echo 'Please login.';
}
?>
</body>
</html>
I have a problem on Facebook App.
I want to make a fan-gate when any one enter the app url, Ex. apps.facebook.com/zoomcompetition/
I can't make it on the tab because it display blank.
but it works on the app url so I want to add fan-gate on the app appoint to Facebook Page.
This is the code
<?php
require 'src/facebook.php';
//require 'fbconfig.php';
require 'functions.php';
// Create An instance of our Facebook Application.
$facebook = new Facebook(array(
'appId' => ***************,
'secret' => **************,
));
// Get the app User ID
$user = $facebook->getUser();
if ($user) {
try {
// If the user is authenticated and logged-in
$user_profile = $facebook->api('/me');
//var_dump($user_profile);
} catch (FacebookApiException $e) {
error_log($e);
$user = null;
}
// If the user is authenticated then generate the variable for the logout URL
if ($user) {
$logoutUrl = $facebook->getLogoutUrl();
?>
<!-- Insert Logged in HTML here -->
Logout
<?php
//Always place this code at the top of the Page
session_start();
if (!isset($_SESSION['id'])) {
// Redirection to login page facebook
header("location: index.php");
}
echo ' Welcome '.$_SESSION['username']; // or whatever you want your user to see.
$varri = "http://www.*****.ps";
?>
<iframe src=<?php print $varri; ?> scrolling="auto" width=100% height=100% frameborder="0"> </iframe>
<?php
$user = $facebook->getUser();
if ($user) {
$ret_obj = $facebook->api('/me/feed', 'POST',
array(
'link' => 'https://www.************.com',
'picture' => 'http://www.*******************.jpg',
'caption' => "أهلا وسهلا!",
'message' => ' Welcome '.$_SESSION['username'],
'uid'=> $facebook->getUser()
));
}
?>
<?php
} else {
$loginUrl = $facebook->getLoginUrl();
}
if (!empty($user_profile )) {
$username = $user_profile['name'];
$uid = $user_profile['id'];
$email = $user_profile['email'];
$user = new User();
$userdata = $user->checkUser($uid, 'facebook', $username,$email,$twitter_otoken,$twitter_otoken_secret);
if(!empty($userdata)){
session_start();
$_SESSION['id'] = $userdata['id'];
$_SESSION['oauth_id'] = $uid;
$_SESSION['username'] = $userdata['username'];
$_SESSION['email'] = $email;
$_SESSION['oauth_provider'] = $userdata['oauth_provider'];
//header("Location: home.php");
?>
<!--<!DOCTYPE>
<HTML>
<head>
<script>
function run(){
window.location.href = '/facebook/home.php';
}
</script>
</head>
<body onLoad="run()">
</body>
</html> -->
<?php
}
} else {
die("There was an error.");
}
}
else {
// Generate a session if there is none.
$login_url = $facebook->getLoginUrl(array( 'scope' => ' read_stream, publish_stream, email'));
?>
<!DOCTYPE>
<HTML>
<head>
<script>
function run(){
window.location.href = '<?php echo $login_url ?>';
}
</script>
</head>
<body onLoad="run()">
</body>
</html>
<?php
}
?>
Can you help me to solve one of the following:
What do I need to make it not display "Blank" on the tab?
2- How can I make a fan-gate for specific Facebook Pae if any one go to App
url directly?
What do I need to make it not display "Blank" on the tab?
Generate some output instead of nothing, I’d guess …?
How can I make a fan-gate for specific Facebook Pae if any one go to App url directly?
You can redirect from the canvas page to a specific page/app combination via JavaScript (top.location.href = "FB-Address of your page/app id combo"). And to check whether you’re on the canvas page, the simplest way to do so is give it an extra GET parameter in the canvas page address, which you then can evaluate in your code.
After the FBML problems I switched to iFrame apps. All well for now except that 2 things:
1) if I did not entered in the app for a few hours and I try to enter, sometimes it gives me the error page that my server did not responded. It shows the Faceboob page with iFrame inside showing the error. After 1 or 2 refreshes it's working fine.
2) I implemented the new SDK with login like this
$facebook = new Facebook(array(
'appId' => $fbID,
'secret' => $fbSecret,
'cookie' => true,
));
$user = $facebook->getUser();
$loginUrl = $facebook->getLoginUrl();
if ($user) {
try {
$user_profile = $facebook->api('/me');
} catch (FacebookApiException $e) {
d($e);
$user = null;
}
}
if (!$user) {
echo "<script type='text/javascript'>
top.location.href = '$loginUrl';
</script>";
exit;
}
The problem is my first redirect, when user enters for the first time. It redirects to my server URL not my Facebook app URL. If I try to put it like this:
$loginUrl = $facebook->getLoginUrl(
array(
'redirect_uri' => 'http://apps.facebook.com/xxx/'
)
);
the login is entering in an infinite loop.
Any help solving this two problems is welcome:-)
Thanks
Darko4spain when the user is redirected back to your site, you can detect if is in iframe with javascript and send them back. I have same issue with my app. This is not a pretty fix but it works.
if (window!=window.top) {
//FB.Canvas.setAutoResize();
setTimeout("FB.Canvas.setAutoGrow()", 1400);
}else {
top.location.href = 'https://apps.facebook.com/AnotherFeed/?ref=redirect#comments';
}
example: https://anotherfeed.com/plugins/index.php will redirect you back to my canvas if you are not in the canvas.
Building an app with the Facebook JavaScript API that will embedded into a page using the new iframe method.
I want to detect if they have liked the current page. Usually I would use print_r($_REQUEST) in PHP but that doesn't seem to work when using an iframe.
There is also this option: http://developers.facebook.com/docs/reference/fbml/visible-to-connection/ but it says its deprecated and I have never liked this method as its fairly hacky.
What is the way t do it now? Prefer to use XFBML + JavaScript API but can use PHP if required.
We've done this several times, and it seems to work pretty well. It uses XFBML to generate a Like Button widget and the JS SDK to render XFBML and subscribe to Facebook events. Code sample below:
edit: Since you're looking to detect if the user is a fan when the page loads, and FB deprecated the feature to let you get it directly from them when the canvas is loaded by passing fb_page_id to the address query string, you'll need an application install for the user to test their fan-dom of your page. It certainly adds a lot of friction to your application, but it is what it is for now - I guess.
<?php
require 'facebook.php';
// Create our Application instance (replace this with your appId and secret).
$facebook = new Facebook(array(
'appId' => 'YOUR APP ID',
'secret' => 'YOUR APP SECRET',
'cookie' => false,
));
try
{
$session = $facebook->getSession();
if (empty($session['uid']))
{
throw new Exception("User not connected to application.");
}
$is_fan = $facebook->api(array(
'method' => 'fql.query',
'query' => "SELECT uid, page_id FROM page_fan WHERE uid = {$session['uid']}"
));
if (false == $is_fan || count($is_fan) == 0) // 0 results will be returned if the user is not a fan
{
$is_fan = false;
}
else
{
$is_fan = true;
}
}
catch (FacebookApiException $e)
{
/**
* you don't have an active user session or required permissions
* for this user, so rdr to facebook to login.
**/
$loginUrl = $facebook->getLoginUrl(array(
'req_perms' => 'user_likes'
));
header('Location: ' . $loginUrl);
exit;
}
?>
<html>
<head>
</head>
<body>
<? if (empty($is_fan)): //user is not a fan. ?>
<fb:like href="http://www.facebook.com/your-facebook-page"
show_faces="true"
width="400">
</fb:like>
<? else: ?>
Yay! You're a fan!
<? endif; >?
<div id="fb-root"></div>
<script src="http://connect.facebook.net/en_US/all.js" type="text/javascript">
</script>
<script type="text/javascript">
FB.init({
appId: '<?= FB_APP_ID; ?>',
cookie: true,
status: true,
xfbml: true
});
// Subscribe to the edge creation event, from Facebook
FB.Event.subscribe('edge.create', function(response)
{
alert("Congratulations! We are so excited that you are a fan now! woot!")
});
</script>
</body>
</html>
okay, finally got got everything formatted with straight markdown. that wasn't painful at all.. (sike) :|
I want to display the "Request for Permission" box directly when the user enters http://apps.facebook.com/myfancyapp. The Facebook Authentication documentation is pretty clear on how the URL have to look like
https://graph.facebook.com/oauth/authorize?client_id=[APPID]&redirect_uri=http://www.myfancyapp.com/&scope=user_photos,user_videos,publish_stream
Pasting this URL directly into the browser works like it should. What I want is to redirect the user via JavaScript (or something else) from the application URL
http://apps.facebook.com/myfancyapp
to the authentication box URL above.
I thought something like this would work:
<script type="text/javascript">
<!--
window.location = "https://graph.facebook.com/oauth/authorize?client_id=[APPID]&redirect_uri=http://www.myfancyapp.com/&scope=user_photos,user_videos,publish_stream"
//-->
</script>
This redirects me to a page with a body that looks like this
Clicking on the image/test then redirects to the authentication box.
How can I directly redirect to the "Request for Permission" box. I know it works somehow as other developers (Zynga for example) already do it.
I'm doing the same thing as the asker, only instead of window.location, use top.location.href = "https://graph....."
Like:
<script type="text/javascript">
top.location.href = "https://graph.facebook.com/oauth/authorize?client_id=[APPID]&scope=email&redirect_uri=http://apps.facebook.com/myfancyapp/";
</script>
Prompts for login if needed, and then permissions. Then redirects to the app.
Doing this with PHP is a cinch.
On the backend
$facebook = new Facebook( array(
'appId' => '<FB_APP_ID>'
, 'secret' => '<FB_APP_SECRET>'
, 'cookie' => true
));
$fbSession = $facebook->getSession();
if ( !$fbSession )
{
$url = $facebook->getLoginUrl( array(
'canvas' => 1
, 'fbconnect' => 0
, 'display' => 'page'
, 'cancel_url' => null
, 'req_perms' => 'user_photos,user_videos,publish_stream'
) );
}
And then, on the frontend
<script type="text/javascript">
top.location.href = '<?php echo $url; ?>';
</script>
<p>
Not being redirected? Click Here.
</p>