Page need to be refresh before Facebook Login works about angular-easyfb HOT 6 OPEN

href="#" class="btn btn-default btn-lg" ng-click="login()"
ng-disabled="loginStatus.status == 'connected'"> Login Using Facebook

from angular-easyfb.

I'm having this issue. My Angular application loads perfectly, but to login with facebook the user has to refresh the page a few times. Any solution?

from angular-easyfb.

Any error message ?
Did Facebook SDK load properly ?
Matheus Costa [email protected]於 2016年9月13日 週二，下午7:38寫道：

I'm having this issue. My Angular application loads perfectly, but to
login with facebook the user has to refresh the page a few times. Any
solution?

—
You are receiving this because you are subscribed to this thread.
Reply to this email directly, view it on GitHub
#26 (comment),
or mute the thread
https://github.com/notifications/unsubscribe-auth/AAxh_pTiCdH_VXRr0bbftJgkSj9RqlRuks5qpotHgaJpZM4B2uaE
.

from angular-easyfb.

I am having the same issue..

In my controller,

`$scope.loginStatus = {
authResponse : null,
status : null
};
$scope.apiMe = {
id: null,
name: null,
email: null,
picture: null
};

/*Facebook login*/

// updateLoginStatus(updateApiMe);

$scope.facebookLogin = function () {
  		/**
  		 * Calling FB.login with required permissions specified
  		 * https://developers.facebook.com/docs/reference/javascript/FB.login/v2.0
  		 */
  		ezfb.login(function (res) {
  		  /**
  		   * no manual $scope.$apply, I got that handled
  		   */
  		  if (res.authResponse) {
  		    updateLoginStatus(updateApiMe);
  		  }

  		}, {scope: 'email,user_likes'});
};

/**
 * Update loginStatus result
 */
function updateLoginStatus (more) {
  ezfb.getLoginStatus(function (res) {
    $scope.loginStatus = res;

    (more || angular.noop)();
  });
}

/**
 * Update api('/me') result
 */
function updateApiMe () {
  ezfb.api('/me?fields=id,name,email,picture', function (res) {
    	$scope.apiMe = res;
  });
}

$scope.$watch('[loginStatus, apiMe]', 
    function () { 
    	if ($scope.loginStatus.status && $scope.apiMe.id) {
    		if ($scope.loginStatus.status == "connected") {
	        	$scope.performLogin("facebook");
	        }
    	}
}, true);

/*************************************************************************/

//Login Section
$scope.performLogin = function(type){
	if ( type == 'facebook' ) {
		var url = Constants.POST_REQUEST_URL().facebookLoginUrl;
		var data = JSON.stringify({
			email : $scope.apiMe.email,
			fbToken : $scope.apiMe.id,
			name : $scope.apiMe.name
		});
			/**
		     * Calling FB.logout
		     * https://developers.facebook.com/docs/reference/javascript/FB.logout
		     */
		    ezfb.logout(function () {
		      updateLoginStatus(updateApiMe);
		    });
	}		
};`

For the 1st time every thing works perfect.

From my facebook login I go to my dashboard state(I am using ui-router).

When leaving from login page, I am signing out from facebook successfully.

But when I logged out from my dashboard, it comes to Login page and the clicking on Facebook login, facebook login window pops up but a blank one.

I get new facebook pop-up window only when I reload my browser.

So now I am using this below code in my login controller to overcome this issue.

if ($cookies.getObject('userLoggedOut')) {
	$cookies.remove('userLoggedOut');
	$window.location.reload();
}

I set this cookie when I log out from my dashboard.

from angular-easyfb.

""But when I logged out from my dashboard, it comes to Login page and the clicking on Facebook login, facebook login window pops up but a blank one.""

More over to this. I could give my credentials, it getting successfully logged in to Facebook, but the popup window is not getting closed and return to my domain.

Simply when I reload the page, it works normal.

Also I came to notice that when I come from page.dashboard to $state.go("page.login"); Facebook sdk is not getting loaded. Becase of that ezfb.login() not working.

from angular-easyfb.

You can solve this by calling:
FB.XFBML.parse(); // from the Facebook SDK directly

Causes a flashing of the Facebook UI elements if those elements are already loaded, so you might need to arrange some way of detecting the refresh conditions.

https://developers.facebook.com/docs/reference/javascript/FB.XFBML.parse

from angular-easyfb.