I am able to retrieve user information but i am unable to get oath token and idtoken to send to my backend. How can i get those info like that of Google Sign In which returns me idtoken and oathtoken using AppAuth library.
Below code for reference.
import React, { Component } from 'react';
import { Image, Button, StyleSheet, Text, View, AsyncStorage } from 'react-native';
import { AuthSession } from 'expo';
const FB_APP_ID = 'some_app_id';
export default class FacebookLogin extends Component {
accessToken: any;
constructor(props) {
super(props);
this.accessToken = ''
}
state = {
userInfo: null,
};
render() {
return (
<View style={{ flex: 1, alignItems: 'center', justifyContent: 'center' }}>
{!this.state.userInfo ? (
<View style={styles.login_facebook}>
<Button color="#fff" title="Login with facebook" onPress={this._handlePressAsync} ></Button>
</View>
) : (
this._renderUserInfo()
)}
</View>
);
}
_renderUserInfo = () => {
return (
<View style={{ alignItems: 'center' }}>
<Image
source={{ uri: this.state.userInfo.picture.data.url }}
style={{ width: 100, height: 100, borderRadius: 50 }}
/>
<Text style={{ fontSize: 20 }}>{this.state.userInfo.name}</Text>
<Text>ID: {this.state.userInfo.id}</Text>
<Button title="logout" onPress={this.logOutFromFacebook}></Button>
</View>
);
};
logOutFromFacebook = async () => {
AsyncStorage.clear();
AsyncStorage.getItem('token').then((res) => console.log("token from asynstorage after logout " + res))
}
_handlePressAsync = async () => {
let redirectUrl = AuthSession.getRedirectUrl();
// You need to add this url to your authorized redirect urls on your Facebook app
console.log({
redirectUrl
});
// NOTICE: Please do not actually request the token on the client (see:
// response_type=token in the authUrl), it is not secure. Request a code
// instead, and use this flow:
// https://developers.facebook.com/docs/facebook-login/manually-build-a-login-flow/#confirm
// The code here is simplified for the sake of demonstration. If you are
// just prototyping then you don't need to concern yourself with this and
// can copy this example, but be aware that this is not safe in production.
let result = await AuthSession.startAsync({
authUrl:
`https://www.facebook.com/v2.8/dialog/oauth?response_type=token` +
`&client_id=${FB_APP_ID}` +
`&redirect_uri=${encodeURIComponent(redirectUrl)}`,
});
if (result.type !== 'success') {
alert('Uh oh, something went wrong');
return;
}
this.accessToken = result.params.access_token;
let userInfoResponse = await fetch(
`https://graph.facebook.com/me?access_token=${this.accessToken}&fields=id,name,picture.type(large)`
);
const userInfo = await userInfoResponse.json();
AsyncStorage.setItem('token', this.accessToken);
this.setState({ userInfo }, () => {
console.log("Userifno" + JSON.stringify(userInfo))
});
AsyncStorage.getItem('token').then((res) => console.log("token from asynstorage " + res))
};
}
const styles = StyleSheet.create({
login_facebook: {
backgroundColor: '#4C69BA',
padding: 6,
color: 'white'
},
})