I have implemented the facebook login for my ionic application, which works perfectly when run on web. When i build the application, create an apk of the same, and try to run on my mobile device, nothing happens.
The login is:
openFB.login(
function (response) {
if (response.status === 'connected') {
console.log('Facebook login succeeded, got access token: ', response);
openFB.api({
path: '/me',
success: function (data) {
console.log("My Data", data);
userData.name = data.name;
userData.picture = 'http://graph.facebook.com/' + data.id + '/picture?type=small';
localStorageService.set('user', userData);
$timeout(function() {
$state.go('app.home');
}, 0);
},
error: function(error) {
console.log("Error here:", error);
}
});
} else {
console.log('Facebook login failed: ' + response);
}
}, { scope: 'email, public_profile' });
Have used openFB for the login. After clicking, following popup comes up.
After clicking the okay, nothing gets logged. No console message.
Can some one help me for finding out this issue, where i am not able to do the facebook login, when run on actual device.
You need to whitelist the redirect url. You can set it in
Products > Facebook Login > Settings > Client OAuth Settings
Take a look into this question.
please set redirect URI in
Products > Facebook Login > Settings > Client OAuth Settings
http://localhost/callback
please follow the below procedure to register your app in facebook developer site
https://ccoenraets.github.io/ionic-tutorial/ionic-facebook-integration.html
and use the below code to complete the procedure of facebook login
$cordovaOauth.facebook("appId", ["email", "public_profile"]).then(function(result) {
//alert(JSON.stringify(result));
//$localStorage.accessToken = result.access_token;
$http.get("https://graph.facebook.com/v2.2/me", {
params: {
access_token: result.access_token,
fields: "id,name,gender,location,email,picture,relationship_status",
format: "json"
}
}).then(function(result) {
// alert(JSON.stringify(result));
$scope.loginflowusingsociallogin(result.data.email);
}, function(error) {
alert("There was a problem getting your profile. Check the logs for details.");
alert(JSON.stringify(error));
});
});
i used Oauth 2.0 authentication for ionic.
I used this code and worked fine for me
Related
I am stared developing a flutter project with AWS Cognito login features. In flutter, AWS Cognito login was working fine and I am getting the access token but when checking that in API or JWT its shows the error "Invalid Signature".
I add the below code for the AWS Cognito login features. I have installed the amplify_auth_cognito: '<1.0.0' in pubspec.yaml file to create the AWS Cognito login features in the app. Login codes working fine and perfectly but the token which returns from that code shows "Invalid Signature".
Future<String> _signIn(LoginData data) async {
try {
SignInResult res = await Amplify.Auth.signIn(
username: data.name,
password: data.password,
);
final resp = await Amplify.Auth.fetchAuthSession(
options: CognitoSessionOptions(getAWSCredentials: true),
);
if (resp.isSignedIn) {
final sess = resp as CognitoAuthSession;
print("TOKEN FROM THE COGNITO: ${sess.userPoolTokens.accessToken}");
}
setState(() {
isSignedIn = res.isSignedIn;
});
if (isSignedIn) {
_btnController.success();
AWSConfigurationHelper().getUserDetails();
Timer(Duration(seconds: 1), () {
_btnController.reset();
Navigator.pushReplacementNamed(context, DeviceList.routeName);
});
}
} on AuthError catch (e) {
Alert(
context: context,
type: AlertType.error,
title: "Login Failed",
desc: e.cause.toString(), //e.toString(),
).show();
_btnController.error();
Timer(Duration(seconds: 1), () {
_btnController.reset();
});
print(e.cause);
for (final exception in e.exceptionList) {
print(exception.exception);
print(exception.detail);
}
return 'Log In Error: ' + e.toString();
}}
My pubspec.yaml file screenshot was attached. In that file I am using amplify_auth_cognito: '<1.0.0' for the Cognito login.
I am new to this Flutter so I really need someone help to fix this problem. I have done the AWS Cognito Login features in iOS and web with the same AWS credentials but there I am not getting this type of "Invalid Signature" issue in the access token. Someone, please help me because I am not any good link where this type of issue has been discussed.
Thanks in advance
So I am trying to add Facebook Login to my page but I am having some difficulties. I am trying to figure out how to test these features in development before I go to production but I don't completely understand how to do that.
I have followed the facebook api instructions so I think I have something that should work but I can't test. That code is below:
<script>
function fb_login() {
FB.login( function() {}, { scope: 'email,public_profile' } );
}
// This is called with the results from from FB.getLoginStatus().
function statusChangeCallback(response) {
console.log('statusChangeCallback');
console.log(response);
// The response object is returned with a status field that lets the
// app know the current login status of the person.
// Full docs on the response object can be found in the documentation
// for FB.getLoginStatus().
if (response.status === 'connected') {
// Logged into your app and Facebook.
testAPI();
} else if (response.status === 'not_authorized') {
// The person is logged into Facebook, but not your app.
document.getElementById('status').innerHTML = 'Please log ' +
'into this app.';
} else {
// The person is not logged into Facebook, so we're not sure if
// they are logged into this app or not.
document.getElementById('status').innerHTML = 'Please log ' +
'into Facebook.';
}
}
// This function is called when someone finishes with the Login
// Button. See the onlogin handler attached to it in the sample
// code below.
function checkLoginState() {
FB.getLoginStatus(function(response) {
statusChangeCallback(response);
});
}
window.fbAsyncInit = function() {
FB.init({
appId : '************',
cookie : true, // enable cookies to allow the server to access
// the session
xfbml : true, // parse social plugins on this page
version : 'v2.2' // use version 2.2
});
// Now that we've initialized the JavaScript SDK, we call
// FB.getLoginStatus(). This function gets the state of the
// person visiting this page and can return one of three states to
// the callback you provide. They can be:
//
// 1. Logged into your app ('connected')
// 2. Logged into Facebook, but not your app ('not_authorized')
// 3. Not logged into Facebook and can't tell if they are logged into
// your app or not.
//
// These three cases are handled in the callback function.
FB.getLoginStatus(function(response) {
statusChangeCallback(response);
});
};
// Load the SDK asynchronously
(function(d, s, id) {
var js, fjs = d.getElementsByTagName(s)[0];
if (d.getElementById(id)) return;
js = d.createElement(s); js.id = id;
js.src = "//connect.facebook.net/en_US/sdk.js";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));
// Here we run a very simple test of the Graph API after login is
// successful. See statusChangeCallback() for when this call is made.
function testAPI() {
console.log('Welcome! Fetching your information.... ');
FB.api('/me', function(response) {
console.log('Successful login for: ' + response.name);
document.getElementById('status').innerHTML =
'Thanks for logging in, ' + response.name + '!';
});
}
</script>
My App ID is correct in my application.
Here is my login button:
<img src="../../static/textchange/facebookloginbutton.png" border="0" alt="" height="42px;">
</div>
I made my own so I could choose another image.
So now when I try to login I get this error:
"Given URL is not allowed by the Application configuration: One or more of the given URLs is not allowed by the App's settings. It must match the Website URL or Canvas URL, or the domain must be a subdomain of one of the App's domains."
So I believe I have to choose another domain of some sort to test it? But I don't understand what I am supposed to choose? Do I have to start "hosting" so I can use a real domain? Can I do it locally?
I would appreciate any help in pushing me in the right direction.
Thanks.
You can configure your Valid OAuth redirect URIs under Client OAuth Settings in the Facebook Developers dashboard to allow whatever URL you are using locally. Or set the site URL to use your local URL.
your site URL should be http://localhost:8000/. I think the http:// matters
$scope.login = function() {
FB.login(function(resp) {
var args = { signed_request: resp.authResponse.signedRequest };
$http.get('/auth/facebook/callback', args).then(function(resp) {
// handle success
});
}, {scope: 'email,user_friends,user_location'});
};
I am trying to delete an application tab from a facebook page.
According to the documentation, I should issue a DELETE request to "https://graph.facebook.com/PAGE_ID/tabs/TAB_ID" with a PAGE access token, but when I do so I get the error "(#210) Subject must be a page."
The same happens when trying to update a tab.
I have requested the user for "manage_pages" permission and I have the correct access_token (Adding a tab works perfectly).
the exact request is: https://graph.facebook.com/212757048770606/tabs/app_289329597785433 (with an access token)
Does anyone know what am I doing wrong?? or is there an open bug report?
Thanks alot
I don't have a solution for you, but I do know that I had some problems with removing a tab that boiled down to the fact that the tab's ID (returned from a call to get /PAGE_ID/tabs) already includes the page ID and "tabs" path.
Initially I was building my URL by taking the tab ID and sticking it on the end of /PAGE_ID/tabs/, but that didn't work because the URL ended up being something like /12345/tabs/12345/tabs/app_4567. Once I realized that the tab ID was sort of "compound" already, I got the Remove to work.
Add the page access token to the call of Facebook API
var PageAccessToken = 123456789123456789123456789123456789;
FB.api(
"/{page_id}/tabs",
"POST",
{
"object": {
"app_id": "{page_id}"
}
},{
"access_token": PageAccessToken
},
function (response) {
if (response && !response.error) {
console.log(response);
} else {
console.log(response.error);
}
}
);
function DeleteTabPage(){
var pid = page_id;
var at = access_tocken;
debugger;
FB.api(pid + '/tabs/app_{your app id}', 'DELETE', { app_id: your app id, access_token: at }, function (response) {
debugger;
if (!response || response.error) {
debugger;`enter code here`
alert('Facebook add app error ' + response.error);
} else {
console.log(response);
debugger;
// alert('App has been added');
}
}); /* end of page/tabs*/
}
i have a question.... i am actually developing a facebook application with FB javascript SDK. In my application I need email permission for further processing. i am using
FB.Connect.showPermissionDialog("email");
but some how the dialog doesn't appears... here is my code
<script>
appid = '*************';
name = 'Palmchip Test App';
href = 'https://apps.facebook.com/*********/';
FB.init({
appId:appid, cookie:true,
status:true, xfbml:true
});
FB.getLoginStatus(function(response) {
if (response.session) {
alert("You are logged in...");
FB.Connect.showPermissionDialog("email", function(perms) {
if (!perms) {
alert("no access");
} else {
alert("accessed...");
}
});
}
else {
top.location.href='https://graph.facebook.com/oauth/authorize?client_id='+appid+'&redirect_uri='+href+'&display=page';
}
});
</script>
the alert which says you are logged in... works fine but then nothing happens .....
You need to upgrade to OAuth 2.0 ouath: true
You should use the new OAuth Dialog
You should be aware when upgrading that FB.getLoginStatus() will return different objects: response.authResponse
Try this code block
FB.init({appId: <?= APP_ID ?>, status: true, cookie: true, xfbml: true, oauth:true});
function getin(){
FB.login(function(response) {
if (response.authResponse) {
var regurl = "/login";
location.href=regurl;
} else {
var regurl = "/logout";
window.location.href=regurl;
}
}, {scope:'email'});
}
So when you call the getin() function , if the current user already gave you the email address it'll do nothing for him just will redirect him to /login url , but if the user is a new user then he/she will see a pop-up box asking for the email address once he/she allows that you can pull the email address using graph or fql. BTW response inside FB.login has the user id , access_toke and some more useful data so save that for further use.
I am working on a Facebook canvas iFrame application, and I`m going insane.
I am trying to check if a user is a fan of the page where the app is located, so that I can allow or disallow voting.
I use the following code:
function CheckFan() {
FB.init({
appId: 'xxxxxxxxxxxxxxxxxxxxxxxxxx',
status: true, // check login status
cookie: true, // enable cookies to allow the server to access the session
xfbml: true // parse XFBML
});
FB.api({ method: 'pages.isFan', page_id: '145116742177104' }
, function(resp) {
if (resp) { $('#main_frame').show(); $('#non_fan').hide(); }
else { $('#main_frame').hide(); $('#non_fan').show(); }
});
}
This JS SDK is driving me up the wall, while calling the documentation "incomplete" is an insult to incompleteness.
Any input will be appriciated.
Thank you!
-Elad
This has been deprecated by Facebook.
A new Graph API alternative will hopfuly be available by the time we need to deploy the app.
For now I use FQL:
FB.api({ method: 'fql.query', query: 'SELECT uid FROM page_fan WHERE uid= ' + user_id + ' AND page_id=145116742177104' },
function(result) {
if (result.length)
{ $('.main_frame').show(); $('#non_fan').hide(); } else { $('.main_frame').hide(); $('#non_fan').show(); }
});