I'm using React Native 0.61.5 with react-native-fbsdk 2.0.0. Facebook app is Live and configured.
The problem is with the Facebook Login when the permission is removed, facebook cannot re-authorise the Facebook Login anymore and keep displaying error in the facebook app.
error message with Facebook App already signed-in and try to use facebook login
Above was just one of the test case. Prior to "Removing" the app permission in Facebook, the facebook login seems to be fine.
This is the basic RN code for Facebook Login
<LoginButton
onLoginFinished={
(error, result) => {
if (error) {
console.log("login has error: " + result.error);
} else if (result.isCancelled) {
console.log("login is cancelled.");
} else {
AccessToken.getCurrentAccessToken().then(
(data) => {
console.log(data.accessToken.toString())
}
)
}
}
}
onLogoutFinished={() => console.log("logout.")}/>
Any of you have any clue or solution?
I'm expecting that the facebook login will re-authorize again but it's not.
Please try adding permissions to the LoginButton like this. So that login button will look for the permissions too. Let me know if facebook re autorize for you..
<LoginButton
permissions={["email", "user_friends", "public_profile"]}
onLoginFinished={this._onFacebookLoginFinished.bind(this)}
onLogoutFinished={this._onFacebookLogoutFinished.bind(this)}
/>
Thank you #imjaad for your attempt to answer my question.
I've resolved this by appealing on Facebook App which the app was Lived, but it has a message that "some of the functions are being restricted".
So, even if Facebook App is Live, make sure there is nothing else / warning / error message that shows up.
I tried to create another Facebook App and it was working fine as well. So nothing wrong with the fbsdk, rn or the code itself.
It was just rare event in Facebook while the appeal is in progress, the Facebook QC made it live temporary, but the message that the app is still being restricted still appear.
So make sure your FB App is Live and there is no other error / warning message in your Facebook App Dashboard.
Good Luck!
Related
I am trying to login with facebook using Supabase on ios emulator. After logging in with Facebook, it redirects me back to localhost. I don't know exactly what to do on this side. Can you help me? I'm still very new.
const onHandleLogin = async () => {
const {data, error} = await supabase.auth.signInWithOAuth({
provider: 'facebook',
});
if (error) {
return;
}
if (data.url) {
const supported = await Linking.canOpenURL(data.url);
if (supported) {
await Linking.openURL(data.url);
}
}
};
After the login process, it still stays on the localhost address on the browser. My purpose is to send it to the application and get token information via the url, but I have no idea how.
I think I need to make changes here but I don't know what to write in the site url because it is a mobile application.
Thanks for your support and replies.
I tried to login with facebook using supabase, but after logging in, it keeps me in safari and gives token information on localhost. I want to direct the application after the login process and get the token information.
You will need to create a deep link for your React Native app: https://reactnative.dev/docs/linking and then set this as your redirect URL. Here a similar example with Flutter: https://supabase.com/docs/guides/getting-started/tutorials/with-flutter#setup-deep-links
Is there a working url scheme for posting on Facebook app (not opening in browser) from Expo app? I've read all about deep linking on Expo documentation, but whatever I type for fb:// it only opens the app and does nothing, and I need to post some text. I've used expo-linking to share an image or text in Facebook Messenger and other apps (Sms, Twitter, WhatsApp) and it's working:
const openMessenger = async() => {
try{
await Linking.openURL(`fb-messenger://share/?link=${myLink}`);
}
catch(error){
console.log(error);
}
}
I am using react-native-fbsdk to login through facebook on my react-native app.
I call LoginManager.logOut() to logout: it does not actually properly logout since the next time I try to login, it does not ask me for login/password again so I can only login on one account. I can not find a way to login to another facebook account.
This guy (react-native-fbsdk: How properly log out from facebook?) had the same problem and seem to have found no solution.
One trick on iOS is to go to safari then logout from the mobile facebook website. This does not work on android though :(
EDIT:
Here is my facebook login code:
function login() {
return LoginManager.logInWithReadPermissions(FACEBOOK_PERMISSIONS)
.then(result => {
if (result.isCancelled) {
throw new Error("Login canceled");
}
return AccessToken.getCurrentAccessToken();
})
.then(({ accessToken }) => accessToken);
}
Video of logout/login: https://d3vv6lp55qjaqc.cloudfront.net/items/132L2U1p383E1y0l2l2v/Screen%20Recording%202018-10-31%20at%2002.52%20PM.mov
So I found this solution, that is not a hack but the proper way to perform a logout on facebook. You need to create a GraphRequest to ask a deletion of permissions.
Below the code, I hope that will help you. I test it on Android and IOS, and that work like a charm.
FBLogout = (accessToken) => {
let logout =
new GraphRequest(
"me/permissions/",
{
accessToken: accessToken,
httpMethod: 'DELETE'
},
(error, result) => {
if (error) {
console.log('Error fetching data: ' + error.toString());
} else {
LoginManager.logOut();
}
});
new GraphRequestManager().addRequest(logout).start();
};
The problem is not with react-native-fbsdk but with Facebook or the browser through which the user logs in to connect to your app, the reason being every-time your app accesses the Facebook login through the browser or the Facebook app where the user-account is already logged-in, which is why it doesn't show you username or password fields.
To solve this issue, the user must logout from the browser or Facebook through which he/she logged in (for app permission initially) to your app, so when the user comes back to your app and selects the Facebook-login option, assuming user logged-out of your app as well, then he/she can see it redirecting to the Facebook or browser login page with username and password fields.
I'm using Instagram API for authentication in my app. the API works fine but when a user is using two-factor authentication the redirect_uri doesn't work and user redirected to the Instagram main page instead of the correct URL (my app login URL). I don't know how should I handle this and couldn't find any good answer. please help me
Note: this scenario happens for the first time and when Instagram's login session is available in browser user logged in correctly.
Not sure if this is still helpful. But I implemented the following on React Native WebView component and resolved Instagram's clear misstep.
Note - A more robust solution would be for Instagram to actually solve the bug.
As props on WebView:
source={{ uri: this.state.uri }}
onNavigationStateChange={this._onNavigationStateChange}
The handling method:
_onNavigationStateChange(webViewState){
const url = webViewState.url || ''
if(url.includes('challenge')){
this.setState({challenged: true})
}
if(url === 'https://www.instagram.com/' && this.state.challenged){
this.setState({
uri: `${URI}&indifferent_query_param=${(new Date).getTime()}`
})
}
}
The handling method forces rerender of WebView and sends the user to the "authorize" page. Depending on your platform of implementation, you could apply something similar to the above.
I'm new in Javascript and react native, I want to know if there's a way to integrating existing account login with facebook?
so a user can login with his/her facebook or with a username that already registered
I've spent a couple hours to find any tutorial about my issue, but no luck till now
For facebook , you may consider using react-native-fbsdk.
As per their docs, they provide, LoginButton with various permission levels
The sample code to to get the login status is as follows
LoginManager.logInWithReadPermissions(['public_profile']).then(
function(result) {
if (result.isCancelled) {
alert('Login was cancelled');
} else {
alert('Login was successful with permissions: '
+ result.grantedPermissions.toString());
}
},
function(error) {
alert('Login failed with error: ' + error);
}
);
For other social-auth support checkout this library react-native simple-auth, the documentation is well mentioned along with the steps to integrate it.
Hope it helps!