React-native fbsdk 获取名称和电子邮件
Posted
技术标签:
【中文标题】React-native fbsdk 获取名称和电子邮件【英文标题】:React-native fbsdk get name and email 【发布时间】:2018-05-01 21:34:28 【问题描述】:我正在使用 react-native-fbsdk。我想在用户注册应用程序时向用户显示用户名和电子邮件,以便为应用程序创建配置文件,但未显示任何数据。如何获取这些数据以及如何在不同的屏幕上显示它。
这是我的代码
import FBSDK from 'react-native-fbsdk'
import LoginButton,AccessToken,GraphRequest,GraphRequestManager from 'react-native-fbsdk';
const
LoginManager,
= FBSDK;
<LoginButton
readPermissions=['public_profile']
onLoginFinished=
(error, result) =>
if (error)
alert("login has error: " + result.error);
else if (result.isCancelled)
alert("login is cancelled.");
else
AccessToken.getCurrentAccessToken().then(
(data) =>
const infoRequest = new GraphRequest(
'/me?fields=name,picture',
null,
this._responseInfoCallback
);
// Start the graph request.
new GraphRequestManager().addRequest(infoRequest).start();
)
onLogoutFinished=() => alert("logout.")/>
</View>
);
_responseInfoCallback = (error, result) =>
if (error)
alert('Error fetching data: ' + error.toString());
else
alert('Result Name: ' + result.name);
感谢朋友
【问题讨论】:
【参考方案1】:我在使用 firebase 时检索了 Facebook 登录信息。
导入此文件:
从“react-native-firebase”导入firebase; 从“react-native-fbsdk”导入 AccessToken, LoginManager ;
Firebase 登录代码在我单击按钮时起作用:
export const fbLogin = () =>
LoginManager.logInWithReadPermissions(["public_profile", "email"])
.then(result =>
if (result.isCancelled)
console.log("Login was cancelled");
return AccessToken.getCurrentAccessToken();
)
.then(data =>
const credential = firebase.auth.FacebookAuthProvider.credential(
data.accessToken
);
firebase
.auth()
.signInWithCredential(credential)
.then(result =>
Toast.show(
text: "Sucessfully",
position: "top"
);
console.log("Successfully Login", result);
)
.catch(error =>
console.log("Failed", error);
);
)
.catch(err =>
console.log("fail", err);
);
;
我检索我的 Facebook 登录数据
console.log("Successfully Login", result);
结果包含用户名、电子邮件、图片和 ..ect 凭据
【讨论】:
【参考方案2】:如果你不想使用 firebase,
const infoRequest = new GraphRequest(
'/me?fields=name,email,picture.type(large)',
null,
this._responseInfoCallback
);
new GraphRequestManager().addRequest(infoRequest).start();
_responseInfoCallback = (error, result) =>
if (error)
alert('Error fetching data: ' + error.toString());
else
this.setState( userName: result.name, userEmail: result.email ,userPic:result.picture.data.url);
AsyncStorage.setItem("UserName",this.state.userName);
AsyncStorage.setItem("Email", this.state.userEmail);
AsyncStorage.setItem("UserPic", this.state.userPic);
// SharedPreferences.setItem("UserName", this.state.userName);
// SharedPreferences.setItem("Email", this.state.userEmail);
// SharedPreferences.setItem("UserPic", this.state.userPic);
console.log("Picture"+ this.state.userPic + "Name" + this.state.userName + "Email" + this.state.userEmail);
【讨论】:
以上是关于React-native fbsdk 获取名称和电子邮件的主要内容,如果未能解决你的问题,请参考以下文章
为 iOS React-Native 项目设置 Fbsdk 框架
React-Native FBSDK LoginButton 仅在 iOS 中崩溃应用程序
react-native run-android失败,出现“Task:app:compileDebugJavaWithJavac FAILED”安装后的react-native-fbsdk