So I have to ask for extended permission by clicking the enter button, but after the login is necessary to refresh the page in order to display the app. Here's my code:
<?php
require 'facebook.php';
$facebook = new Facebook(array(
'appId' => '< THE APPID >',
'secret' => '< THE SECRET >',
'cookie' => true,
));
$user = $facebook->getUser();
if ($user) {
try {
$user_profile = $facebook->api('/me');
} catch (FacebookApiException $e) {
error_log($e);
$user = null;
}
}
?>
<body>
<div id="fb-root"></div>
<script>
window.fbAsyncInit = function() {
FB.init({
appId : '< THE APPID >',
status : true,
cookie : true,
xfbml : true
});
// Additional initialization code such as adding Event Listeners goes here
$('#btn-enter').click(function(){
login();
});
};
(function(d){
var js, id = 'facebook-jssdk', ref = d.getElementsByTagName('script')[0];
if (d.getElementById(id)) {return;}
js = d.createElement('script'); js.id = id; js.async = true;
js.src = "//connect.facebook.net/en_US/all.js";
ref.parentNode.insertBefore(js, ref);
}(document));
function login() {
FB.login(function(response) {
if (response.authResponse) {
// connected
} else {
// cancelled
}
//});
}, {scope: 'read_friendlists,friends_photos,publish_stream'});
}
</script>
<?php if ($user): ?>
<!--Here is my APP-->
<?php else: ?>
<a id="btn-enter">Enter</a>
<?php endif ?>
Is there a better way to do this ? What works for me is:
function login() {
FB.login(function(response) {
if (response.authResponse) {
top.location.href='https://the_app_url';
} else {
}
//});
}, {scope: 'read_friendlists,friends_photos,publish_stream'});
}
But this causes the entire page to refresh and is not 'elegant' per se...