facebook page with login not sending APP ID - facebook

I have a code that works in one web, and when I try it in another web it doesnt work. The code should build a login button but the button is not displayed because it seems that the app id is not sent. The code:
<div id="fb-root"></div>
<?php
defined('_JEXEC') or die;
?>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
<script type="text/javascript">
$.ajaxSetup ({
cache: false
});
var ajax_load = "<img class='loading' src='http://fshf.org/images/loading.gif' alt='loading...' style='margin-left:261px; margin-top:40px' />";
</script>
<link href="modules/mod_facebook/tmpl/css/style.css" rel="stylesheet" type="text/css">
<script>
$(document).ready(function() {
$("#close").click(function(){
$("#erresira").remove();
$("#popup").remove();
});
$("body").prepend( "<div id='erresira'></div>" );
var window_h = $(window).height()/2;
var window_w = $(window).width()/2;
$("#popup").css({top:window_h,left:window_w});
$("#popup").animate({
left: "-=230px",
width: "+=460px",
top: "-=127px",
height: "+=254px"
}, 0 );
});
</script>
<div id="fb-root"></div>
<script>
window.fbAsyncInit = function() {
FB.init({
appId : '205862336256764',
channelUrl : 'http://livebast.infoalbania.org/modules/mod_facebook/tmpl/channel.html',
status : true,
cookie : true,
xfbml : true
});
FB.Event.subscribe('auth.authResponseChange', function(response) {
if (response.status === 'connected') {
allowed();
} else if (response.status === 'not_authorized') {
FB.login();
} else {
FB.login();
}
});
};
(function(d){
var js, id = 'facebook-jssdk', ref = d.getElementsByTagName('script')[0];
if (d.getElementById(id)) {return;}
js = d.createElement('script'); js.id = id; js.async = true;
js.src = "//connect.facebook.net/en_US/all.js";
ref.parentNode.insertBefore(js, ref);
}(document));
function allowed() {
FB.getLoginStatus(function(response) {
var page_id = "184393808323569";
var user_id = response.authResponse.userID;
var uid = response.authResponse.userID;
var loadUrl = "http://livebast.infoalbania.org/modules/mod_facebook/tmpl/ajax.php";
$("#result").html(ajax_load).load(loadUrl+"?user_id=" + uid );
});
}
</script>
<div id="result"></div>
<div id="popup">
<div id="login"> <img src="<?=$params->get('image');?>" />
<p><strong>
<?=$params->get('content');?>
</strong></p>
<div id="appp">
<fb:login-button show-faces="true" width="230" max-rows="10"></fb:login-button>
</div>
<div id="like">
<fb:like href="https://www.facebook.com/LiveBast" width="330" show_faces="false" send="false"></fb:like>
</div>
</div>
<div id="close" class="close"></div>
</div>
the second page (the one where the code does not work is: livebast.infoalbania.org and is on a PLESK server)
can this be an issue of a misconfiguration of the subdomain?

Related

Connect my webapp to the facebook api and write fql query using jquery

so far I am following the facebook doc to get started to connect webapp to facebook api. but i am lost somewhere.
"<script>"
$(document).ready(function() {
$.ajaxSetup({
cache: true
});
$.getScript('//connect.facebook.net/en_US/sdk.js', function() {
FB.init({
appId: '{app-id}',
version: 'v2.5' // or v2.0, v2.1, v2.2, v2.3
});
$('#loginbutton,#feedbutton').removeAttr('disabled');
FB.getLoginStatus(updateStatusCallback);
});
});
"</script>"
where and how should i wright the fql query
what is the access token, does it changes over time for same page.
where should i give the access token to get the data from facebook.
<html>
<head>
<meta charset="utf-8"/>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js" ></script>
</head>
<body style="background-color:#cfeae3;">
<script>
window.fbAsyncInit = function() {
FB.init({
appId : '<your app id>',
xfbml : true,
version : 'v2.5'
});
};
(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'));
function getData(){
FB.getLoginStatus(function(response) {
if (response.status == 'connected') {
city = $('#city').val(); FB.api("<query>",function(responses){
}else if (response.status === 'not_authorized') {
alert("not auth");
document.getElementById('response').innerHTML = 'not logged in' ;
} else {
alert("not conne");
document.getElementById('response').innerHTML = 'not connected';
}
});
}
</script>
<div class="container">
<div id="tfheader" align="center">
<input type="text" class="tftextinput" name="q" id= "city"/>
<input id="btn" class="tfbutton" type="submit" onclick="getData()" />
</div>
</body>
</html>

enter facebook based login details in mysql db

I am looking to create facebook login system in my website using javascript SDK. I am able to login as per details mentioned in facebook website. I am trying to enter data in mysql database primarily email ID of users. I am unable to do so despite different options. Need help. also how to disappear login button once user is logged into the system. Please help. below is the basic code
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.0.0/jquery.min.js"></script>
</head>
<body>
<div id="fb-root"></div>
<script>
window.fbAsyncInit = function() {
FB.init({
appId : 'XXXX',
channelUrl : '//XXXX',
status : true,
cookie : true,
xfbml : true
});
FB.Event.subscribe('auth.authResponseChange', function(response) {
if (response.status === 'connected') {
testAPI();
} else if (response.status === 'not_authorized') {
FB.login();
} else {
FB.login();
}
});
};
(function(d){
var js, id = 'facebook-jssdk', ref = d.getElementsByTagName('script')[0];
if (d.getElementById(id)) {return;}
js = d.createElement('script'); js.id = id; js.async = true;
js.src = "//connect.facebook.net/en_US/all.js";
ref.parentNode.insertBefore(js, ref);
}(document));
function testAPI() {
console.log('Welcome! Fetching your information.... ');
FB.api('/me', function(response) {
$.post('send.php', {'name':response.name});
alert('Good to see you, ' + response.email + '.');
});
}
</script>
<fb:login-button show-faces="true" autologoutlink="true" scope="user_about_me,email" width="200" size= "large" max-rows="1"></fb:login-button>
<div class="fb-like" data-send="true" data-width="450" data-show-faces="true"> </div>
</body>
</html>

Facebook javascript sdk is not woking

I am using the following code for facebook authentication.
<html>
<head>
</head>
<body>
<div id="fb-root"></div>
<script>
window.fbAsyncInit = function() {
FB.init({
appId : '498085136....',
status : true,
cookie : true,
xfbml : true,
oauth : true,
});
};
(function(d){
var js, id = 'facebook-jssdk'; if (d.getElementById(id)) {return;}
js = d.createElement('script'); js.id = id; js.async = true;
js.src = "//connect.facebook.net/en_US/all.js";
d.getElementsByTagName('head')[0].appendChild(js);
}(document));
//LOGIN FUNCTION
function login() {
FB.login(function(response) {
if (response.authResponse) {
alert('Success!');
}else{
alert('Login Failed!');
}
}, {scope: 'email'});
}
</script>
<div onclick="login();">Login with Facebook</div>
</body>
</html>
I dont know what's wrong with that code. When i check my error console, it shows FB is not defined..
Thanks in advance.
Make your html tag like this
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:fb="http://www.facebook.com/2008/fbml">

FB.login not firing in Facebook Mobile Web Application

I am Unable to take the Permissions Dialog as well as Login to Facebook here is my code:
<!DOCTYPE html>
<html>
<head>
<title>My Page</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="http://code.jquery.com/mobile/1.2.0-alpha.1/jquery.mobile-1.2.0-alpha.1.min.css" />
<script src="http://code.jquery.com/jquery-1.7.2.min.js"></script>
<script src="http://code.jquery.com/mobile/1.2.0-alpha.1/jquery.mobile-1.2.0-alpha.1.min.js"></script>
</head>
<body>
<div data-role="page">
<div id="fb-root"></div>
<script>
window.fbAsyncInit = function() {
FB.init({
appId : 'APP_ID', // App ID
channelUrl : 'http://connect.facebook.net/en_US/all.js', // Channel File
status : true, // check login status
cookie : true, // enable cookies to allow the server to access the session
xfbml : true // parse XFBML
});
FB.Event.subscribe('auth.statusChange', handleStatusChange);
};
function handleStatusChange(response) {
document.body.className = response.authResponse ? 'connected' : 'not_connected';
if (response.authResponse) {
// console.log(response);
FB.api('/me/likes/171099129606813', function(response) {
if ( response.data.length === 1 ) { //there should only be a single value inside "data"
console.log('You like it');
} else {
console.log("You don't like it");
}
});
}
else
{
FB.login(function(response) {
if (response.status == 'connected') {
//console.log(response);
FB.api('/me/likes/171099129606813', function(response) {
console.log(response);
});
} else {
alert('Not Logged In');
// user is not logged in
}
}, {scope: 'email,user_likes'});
}
}
// Load the SDK Asynchronously
(function(d){
var js, id = 'facebook-jssdk', ref = d.getElementsByTagName('script')[0];
if (d.getElementById(id)) {return;}
js = d.createElement('script'); js.id = id; js.async = true;
js.src = "//connect.facebook.net/en_US/all.js";
ref.parentNode.insertBefore(js, ref);
}(document));
</script>
<div data-role="header">
<h1>My Title</h1>
</div><!-- /header -->
<div data-role="content">
<p>Hello world</p>
</div><!-- /content -->
</div><!-- /page -->
</body>
</html>
still its not taking me to authentication page it is changing the class name of body but not working on fb login
It took me today a while to understand that window.fbAsyncInit method is not fired on some mobile browsers (in fact on all mobile devices in my company). What you need to do is to add sth like this:
var called = false;
window.fbAsyncInit = function () {
if (called) return;
called = true;
// here the fb code
}
if (!called) window.fbAsyncInit();
This happened to me as well. The FB.login function was nested in a callback. In my case the browser was blocking the popup page from facebook. When I unblocked popups, it came up fine.

Facebook Javascript SDK not working on .xhtml page

I tried out the Javascript SDK in an html file, everything worked fine. Then moved the same code to a .xhtml file & it completely stopped working.
The code as follows:
Moved from file test.html to file test.xhtml & it stopped working
<html xmlns="http://www.w3.org/1999/xhtml" >
<head>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
</head>
<body>
<div id="fb-root"></div>
<script>
// Load the SDK Asynchronously
(function(d){
var js, id = 'facebook-jssdk', ref = d.getElementsByTagName('script')[0];
if (d.getElementById(id)) {return;}
js = d.createElement('script'); js.id = id; js.async = true;
js.src = "//connect.facebook.net/en_US/all.js";
ref.parentNode.insertBefore(js, ref);
}(document));
// Init the SDK upon load
window.fbAsyncInit = function() {
FB.init({
appId : '365436556863538', // App ID
channelUrl : '//'+window.location.hostname+'/channel', // Path to your Channel File
status : true, // check login status
cookie : true, // enable cookies to allow the server to access the session
xfbml : true // parse XFBML
});
// listen for and handle auth.statusChange events
FB.Event.subscribe('auth.statusChange', function(response) {
if (response.authResponse) {
FB.api('/me', function(response){
if (response.name) {
$("#username").html("<img src='https://graph.facebook.com/" + response.id + "/picture'/><div>" + response.name +"</div>");
}
})
$('#auth-loggedout').hide();
$('#auth-loggedin').show();
} else {
// user has not auth'd your app, or is not logged into Facebook
$('#auth-loggedout').show();
$('#auth-loggedin').hide();
}
});
// respond to clicks on the login and logout links
document.getElementById('auth-loginlink').addEventListener('click', function(){
FB.login(function(response) {
// handle the response
}, {scope: 'email'});
});
document.getElementById('auth-logoutlink').addEventListener('click', function(){
FB.logout();
});
}
</script>
<div id="auth-status">
<div id="auth-loggedout">
Login
</div>
<div id="auth-loggedin" style="display:none">
(logout)
</div>
</div>
<div>
<div id="username"></div>
</div>
</body>
</html>
I could just find this in the console window:
Uncaught SyntaxError: Unexpected identifier
window.script1342849602887=1;