I'm working on an AngularJS site and I load the API in the HTML and integrate the Facebook API into a Controller, but I'm having trouble logging out with the Facebook SDK Javascript v2.9.
I receive the following problem when I call FB.logout() in the onclick action
Refused to display '' in a frame because it set 'X-Frame-Options' to 'deny'
HTML CODE
<div class="top-content">
<!--content-->
<fb:login-button class="btn-login" scope="public_profile,email"
onlogin="doFbLogin();" data-button-type="continue_with" data-
auto-logout-link="false" data-use-continue-as="true" data-
size="large">
</fb:login-button>
<button onclick="FB.logout()" class="btn">Logout</button>
</div>
<script>
window.fbAsyncInit = function() {
FB.init({
appId : 'API-KEY',
autoLogAppEvents : true,
status : true,
xfbml : true,
version : 'v2.9'
});
FB.AppEvents.logPageView();
};
(function(d, s, id){
var js, fjs = d.getElementsByTagName(s)[0];
if (d.getElementById(id)) {return;}
js = d.createElement(s); js.id = id;
js.src = "//connect.facebook.net/es_ES/sdk.js";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));
</script>
AngularJS Controller Code
appController.controller('LoginCtrl', ['$scope','$window','$location','$http','sendLoginParams','checkCreds', 'setCreds','setUserSession',
function LoginCtrl($scope, $window,$location,$http, sendLoginParams, checkCreds, setCreds, setUserSession){
$scope.loggin = true;
$window.doFbLogin = function (){
var fb_token;
function checkLoginState() {
$window.FB.getLoginStatus(function(response) {
fb_token = response.authResponse.accessToken;
statusChangeCallback(response);
});
};
function statusChangeCallback(response) {
console.log('statusChangeCallback');
console.log(response);
if (response.status === 'connected') {
facebookLogin();
}
}
facebookLogin = function () {
$window.FB.api('/me',{ fields: 'id, name, email' }, function(response) {
console.log(response);
console.log('Successful login for: ' + response.name);
console.log('Successful login for: ' + response.email);
var id = parseInt(response.id);
var postData = {
"user_fb_id":id,
"user_fb_token": fb_token,
"user_email":response.email,
"user_avatar":"http://graph.facebook.com/" + response.id + "/picture?type=normal",
Can someone please help me with this?