Facebook login popup close button event - facebook-javascript-sdk

I am using facebook login popup in my website. I am showing a loader for api response. But when user click on close button (X) of facebook login window, My loader is showing infinite. So i want to get that event when user click on close button. I am using below code for facebook login popup.
window.fbAsyncInit = function() {
FB.init({
appId : '###',
cookie : true,
xfbml : true,
version : 'v3.1'
});
FB.AppEvents.logPageView();
window.checkLoginState = function() {
FB.getLoginStatus(function(response) {
document.getElementById('loader-response').classList.add('show');
statusChangeCallback(response);
});
}
function statusChangeCallback(response) {
if (response.status === 'connected') {
getProfile();
} else {
window.localStorage.setItem('facebook',false);
}
}
};
(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 = "https://connect.facebook.net/en_US/sdk.js";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));

I have edited your code.
Just add document.getElementById('loader-response').classList.add('show'); after the FB.getLoginStatus(function(response) function.

Related

Find psid after clicking fb-send-to-messenger button

window.fbAsyncInit = function() {
FB.init({
appId : 'app_id',
autoLogAppEvents : true,
xfbml : true,
version : 'v3.2'
});
FB.Event.subscribe('send_to_messenger', function(response) {
if ( response.event == 'clicked' ) {
};
});
};
(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 = "https://connect.facebook.net/en_US/sdk.js";
// js.src = "https://connect.facebook.net/en_US/sdk/debug.js";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));
I am trying to execute the facebook send to messenger api by using facebook javascript sdk . I already have an app which have the webhook events subscribed .So i want to find the psid after clicking the fb-send-to-messenger .

Fb login using extension

What should be the app domain in FB app option in Fb Login when my app is a chrome extension.
I have tried chrome-extension:/[id]
without it the error is coming
Can't Load URL: The domain of this URL isn't included in the app's domains. To be able to load this URL, add all domains and subdomains of your app to the App Domains field in your app settings.
This is my logic.js
window.fbAsyncInit = function() {
FB.init({
appId : '1232048723506658',
xfbml : true,
version : 'v2.6'
});
FB.getLoginStatus(function(response) {
if (response.status === 'connected') {
console.log('Logged in.');
}
else {
console.log('initiate FB login...');
FB.login();
}
});
};
(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 = "https://connect.facebook.net/en_US/sdk.js";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));
Please explain .

Response of facebook send button

how can i get the response of facebook send button whether it is a success or failure
FB.init({
appId : 'XXXXXXXXXXXXX',
status : false, // check login status
cookie : true, // enable cookies to allow the server to access the session
xfbml : true, // parse XFBML add it here
oauth : true
});
(function(d, s, id) {
var js, fjs = d.getElementsByTagName(s)[0];
if (d.getElementById(id)) return;
js = d.createElement(s); js.id = id; js.async = true;
js.src = "//connect.facebook.net/en_US/all.js";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));
FB.Event.subscribe will let you get that data.
Try something like
FB.Event.subscribe('message.send', function(sharedURL) {
// your code here
});

Javascript Facebook API Post

I just want make a script who post when i make the login. I find this code
var body = 'i13 App - Post test';
FB.api('/me/feed', 'post', { message: body }, function(response) {
if (!response || response.error) {
alert('Error occured');
}else {
alert('Post ID: ' + response.id);
}
});
it work with Facebook javascipt Test Console, but when i put in my script i never can post and received the alert('error occured),
Thz for your help,
Have you set up the page code correctly? ensure you have the following code within the page
<div id="fb-root"></div>
<script>
window.fbAsyncInit = function() {
// init the FB JS SDK
FB.init({
appId : 'YOUR_APP_ID', // App ID from the app dashboard
status : true, // Check Facebook Login status
xfbml : true // Look for social plugins on the page
});
// Additional initialization code such as adding Event Listeners goes here
};
// 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/all.js";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));
</script>
https://developers.facebook.com/docs/reference/javascript/
After the user is logged in successfully you can have a button trigger the following code"
var body = 'Reading JS SDK documentation';
FB.api('/me/feed', 'post', { message: body }, function(response) {
if (!response || response.error) {
alert('Error occured');
} else {
alert('Post ID: ' + response.id);
}
});
https://developers.facebook.com/docs/reference/javascript/FB.api/

FB.login fails and execution stops on FB.login

FB.login fails and execution stops on FB.login. I can only see for a few seconds facebook login popup that says "loading", then it disappear and nothing happens.
I have after body tag
<div id="fb-root"></div>
<script>
window.fbAsyncInit = function() {
// init the FB JS SDK
FB.init({
appId : '129519787234412', // App ID from the App Dashboard
channelUrl : '<?=URL?>facebookChannel.php', // Channel File for x-domain communication
status : true, // check the login status upon init?
xfbml : true // parse XFBML tags on this page?
});
// Additional initialization code such as adding Event Listeners goes here
};
// 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/all.js";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));
</script>
After all HTML, in script tag:
$(".box_top_img").click(function(){
FB.login(function(response) {
if (response.authResponse) {
FB.getAuthResponse()['accessToken'];
FB.api('/me', function(response) {
$.ajax({
url:"ajax/check_vote.php",
type:"POST",
data:response,
success:function(response){
var result = $.parseJSON(response);
if(result.code == 0){
$("#container_1").hide();
$("#container_2").hide();
$("#container_3").show();
}else if(result.code == 1){
$("#container_1").hide();
$("#container_2").show();
$("#container_3").hide();
$("#facebook_id").val(result.id);
if(result.first_name)
$("#name").val(result.first_name);
if(result.last_name)
$("#lastname").val(result.last_name);
if(result.email)
$("#email").val(result.email);
}else{
$("#container_1").show();
$("#container_2").hide();
$("#container_3").hide();
}
}
});
});
} else {
console.log('User cancelled login or did not fully authorize.');
}
}, {scope: 'email'});
});
Thanks!!
Check if sandbox mode is disabled on the app settings page
You could try to replace facebook-jssdk with fb-root. This should work.