React-Native-FBSDK 登录不 return 电子邮件

Question

我正在尝试使用默认的 <'LoginButton ... > 通过 Facebook 登录在应用程序中登录，但我无法获取用户的电子邮件。

这是我的按钮：

<LoginButton   
  publishPermissions={["email"]}
  onLoginFinished={
    (error, result) => {
      if (error) {
        alert("Login failed with error: " + error.message);
      } else if (result.isCancelled) {
        alert("Login was cancelled");
      } else {
        alert("Login was successful with permissions: " + result.grantedPermissions)
      }
    }
  }
 onLogoutFinished={() => alert("User logged out")}
/>

这就是我尝试获取用户详细信息的方式：

  async FBGraphRequest(fields, callback) {
    const accessData = await AccessToken.getCurrentAccessToken();

    console.log("token= ", accessData.accessToken )
    // Create a graph request asking for user information
    const infoRequest = new GraphRequest('/me', {
      accessToken: accessData.accessToken,
      parameters: {
        fields: {
          string: fields
        }
      }
    }, this.FBLoginCallback.bind(this));
    // Execute the graph request created above
    new GraphRequestManager().addRequest(infoRequest).start();
  }

  async FBLoginCallback(error, result) {
    if (error) {
      this.setState({
        showLoadingModal: false,
        notificationMessage: "facebook error"
      });
    } else {
      // Retrieve and save user details in state. In our case with 
      // Redux and custom action saveUser
      this.setState({
        id: result.id,
        email: result.email,
        name: result.name
      });
      console.log("facebook login",result)
    }

  }

console.log("facebook login",result) 行 returns 我只有帐户名和 ID，但没有电子邮件字段...

我做错了什么？

PS.: 我也尝试过使用 "custom function"，但它也不起作用（对于电子邮件，登录有效，我只得到用户详细信息，如姓名和 id):

async facebookLogin() {
    // native_only config will fail in the case that the user has
    // not installed in his device the Facebook app. In this case we
    // need to go for webview.
    let result;
    try {
      this.setState({showLoadingModal: true});   
      LoginManager.setLoginBehavior('NATIVE_ONLY');
      result = await LoginManager.logInWithReadPermissions(['public_profile', 'email']);
    } catch (nativeError) {
      try {
        LoginManager.setLoginBehavior('WEB_ONLY');
        result = await LoginManager.logInWithReadPermissions(['email']);
      } catch (webError) {
        // show error message to the user if none of the FB screens
        // did not open
      }
    }
    console.log("facebook result 1: ", result)
    // handle the case that users clicks cancel button in Login view
    if (result.isCancelled) {
      this.setState({
        showLoadingModal: false,
        notificationMessage: I18n.t('welcome.FACEBOOK_CANCEL_LOGIN')
      });
    } else {
      // Create a graph request asking for user information
      this.FBGraphRequest('id, email, name', this.FBLoginCallback);
    }
  }
.
.
.
        <LoginButton   
          publishPermissions={["email"]}
          onPress={
            this.facebookLogin()
          }
          onLogoutFinished={() => alert("User logged out")}
          />

这是应用程序的字段请求。我还需要插入用户的电子邮件：

Answer 1

!!!已解决!!!

权限的 <'LoginButton ...> 属性是“permissions”，而不是 "readPermission"...

所以按钮代码是：

<LoginButton
   permissions={['public_profile', 'email', 'user_birthday', ]}

   onClick={this.facebookLogin}
/>

Answer 2

// imports
import {
  Settings,
  AccessToken,
  LoginManager,
  AuthenticationToken,
  Profile,
  GraphRequest,
  GraphRequestManager,
} from 'react-native-fbsdk-next';
//put this lines in useEffect
Settings.setAppID('2920461228193006');
    Settings.initializeSDK();
    LoginManager.setLoginBehavior('web_only');
// put this method on button press
LoginManager.logInWithPermissions(['public_profile', 'email'])
                  .then(async data => {
                    if (!data.isCancelled) {
                      console.log(data, 'this is data');
                      if (Platform.OS === 'ios') {
                        let token =
                          await AuthenticationToken.getAuthenticationTokenIOS();
                        console.log(token, 'ios token');
                      } else {
                        let token = await AccessToken.getCurrentAccessToken();
                        console.log(token, 'android token');
                      }
                      const infoRequest = new GraphRequest(
                        '/me?fields=email,name,first_name,last_name',
                        null,
                        (err, res) => {
                          console.log({err, res}, 'this is');
                          if (Object.keys(res).length != 0) {
                            doSocialLogin({
                              registerBy: 2,
                              token: res.id,
                              user: {
                                firstName: res.first_name,
                                email: res.email,
                                lastName: res.last_name,
                              },
                            });
                          }
                        },
                      );
                      new GraphRequestManager().addRequest(infoRequest).start();
                    }
                  })
                  .catch(err => {
                    console.log(err, 'this is fb error');
                  });

React-Native-FBSDK 登录不 return 电子邮件

React-Native-FBSDK login doesn't return email

react-native

facebook-login

react-native-fbsdk