keppelen / react-facebook-login

A Component React for Facebook Login
1.18k stars 406 forks source link

Continue as not currently logged user #254

Open kgstefan88 opened 5 years ago

kgstefan88 commented 5 years ago

Hi, first of all, great component.

I have an issue with specific case. Here is the scenario: 1) I'm logged in my browser on FB with Account1. 2) I go to my app, click on Login with FB, PopUp appears, I accept to give my FB info to my application and I do my thing on my app. 3) I go again and reload my app, and I now want to use Account2 this time but I just get data from Account1 without popup.

Is there some way to always ask which account to use? Some prop or maybe I need to call logout somehow.

Hope you understand my question. Thanks.

hoangtrieukd commented 5 years ago

I have problem like that.

kissjozsef commented 5 years ago

Hello, any solution to this issue? i'd like the popup to always show up , now it show up for a second and disappears automatically and the user is logged in

sutefan1 commented 4 years ago

@hoangtrieukd @kissjozsef @kgstefan88 I was experiencing the same issue, but with firebase facebook auth and did some research:

Once you're logged in successfully, facebook is setting some cookies. The cookie named c_user stores some data that tells the login workflow about an active and valid session with a user. So, the login page is skipped and the auth response is passed to the callback.

As there is no way to change cookies from a different domain (like .facebook.com) in javascript, you cannot change this behavior. What you can do is adding scopes in order to force the prompt to show up.

Then the currently logged in user is showing up and if you wanna switch to another user, you can do so.

Just add any scope to your FacebookLogin component and you're good to go. For example, ask for Facebook pages:

<FacebookLogin
        appId={process.env.REACT_APP_FACEBOOK_APP_ID || ""}
        autoLoad={false}
        scope="pages_show_list"
        onClick={componentClicked}
        callback={startSignInProcess}
      />