Facebook comment.create not firing on mobile - ios Safari and android browser - javascript

This is making me crazy - I can't get the facebook comment.create event to fire on mobile devices (not that I tested work). login event is working fine (auth.authResponseChange)
<html>
<head></head>
<body>
<div id="fb-root"></div>
<script>
window.fbAsyncInit = function() {
FB.init({
appId : 'MYAPPID', // App ID
channelUrl : '//WWW.MYAPPURL.COM/channel.html', // 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('comment.create', function(response) { alert("1"); });
// FB.Event.subscribe('auth.authResponseChange', function(response) {alert("1"); });
};
// 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 = "http://connect.facebook.net/en_US/all.js";
ref.parentNode.insertBefore(js, ref);
}(document));
</script>
<fb:login-button show-faces="true" width="200" max-rows="1"></fb:login-button>
comments
<div class="fb-comments" data-notify="true" data-href="http://test/test.htm" data-width="470" data-num-posts="10"></div>
</body>
</html>

Please note that this is still an ongoing FB bug

Related

Redirect to home page after login using "login with facebook" :Javascript

I am using "login with facebook" in my application. I want to redirect to home page after hitting the "Login with facebook" button. I dont know how to implement it...
Code is,
<script>
window.fbAsyncInit = function() {
FB.init({
appId : 'APP ID', // App ID
channelUrl : 'http://www.***.com/', // Channel File
status : true, // check login status
cookie : true, // enable cookies to allow the server to access the session
xfbml : true // parse XFBML
});
// 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 = "js/all.js";
ref.parentNode.insertBefore(js, ref);
}(document));
</script>
<div id="fb-root"></div>
<div class="fb-login-button" data-show-faces="true" data-width="200" data-max-rows="1"></div>
Please help,
Thanks
Use Facebook Event:
FB.Event.subscribe('auth.login', function(){
window.location = 'index.html';
});
new code:
<script>
window.fbAsyncInit = function() {
FB.init({
appId : 'APP ID', // App ID
channelUrl : 'http://www.***.com/', // 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.login', function(){
window.location.href = 'index.html';
});
// 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 = "js/all.js";
ref.parentNode.insertBefore(js, ref);
}(document));
</script>
change index.html with your homepage url.
if you want to add logout too:
FB.Event.subscribe('auth.logout', function(){
window.location.href = 'index.html';
});
change your login button to
<fb:login-button perms="email,publish_stream" autologoutlink="window.location.href='index.html';"></fb:login-button>
Change index.html to your homepage url

Javascript SDK automatically login

I'am trying to get the Login button from Facebook to work on my website using the Javascript SDK. If the user is logged on, I get the email address back. This works. But on the page where I have my Facebook Login button, I also have the normal login for my website. (username & password). But when I go to my login page, the page automatically loads the Facebook button and the Facebook login dialog appears. But I don't want to load this button automatically. I want that users always have to press the login button for Facebook. Is this possible?
This is my code:
<script>
window.fbAsyncInit = function() {
FB.init({
appId: 'MY_APP_ID', // App ID
status: true,
cookie: true,
xfbml: true,
oauth: true,
});
FB.getLoginStatus(function(response) {
FB.login(function(response) {
if (response.authResponse) {
FB.api('/me', function(response) {
alert('Good to see you, ' + response.email + '.');
});
} else {
alert('User cancelled login or did not fully authorize.');
}
});
});
// Additional initialization code here
};
// Load the SDK Asynchronously
(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));
</script>
FB.getLoginStatus method is used to know whether user has logged in or not
FB.login is used to prompt login page to authenticate and authorize the app.
you are calling FB.getLoginStatus method and not bothering about the response and firing fb.login button always.
If you always want user to click login button don't use FB.getLoginStatus
Use this code
<html>
<head>
<title>My Facebook Login Page</title>
</head>
<body>
<div id="fb-root"></div>
<script>
window.fbAsyncInit = function() {
FB.init({
appId : 'YOUR_APP_ID', // App ID
channelUrl : '//WWW.YOUR_DOMAIN.COM/channel.html', // Channel File
status : true, // check login status
cookie : true, // enable cookies to allow the server to access the session
xfbml : true // parse XFBML
});
};
// 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 class="fb-login-button">Login with Facebook</div>
</body>
</html>
FYI: https://developers.facebook.com/docs/guides/web/
check authentication section

Facebook login in a web app

I am trying to implement facebook login in my web application. i got the app id and my code is as follows.`
My Facebook Login Page
<div id="fb-root"></div>
<script>
window.fbAsyncInit = function() {
FB.init({
appId : '<<App Id>> ', // App ID
channelUrl : '//www. DOMAIN NAME.com/channel.html', // Channel File
status : true, // check login status
cookie : true, // enable cookies to allow the server to access the session
xfbml : true // parse XFBML
});
// Additional initialization code here
};
// 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 class="fb-login-button">Login with Facebook</div>
</body>
`. I am trying to run this and its giving an error for my app. I also got the secret key but dont know where exactly to place it. Do we need to place any css or js or any other files for this ??
Any help is greatly appreciated..
appId : '<<App Id>> ', //Place App ID
channelUrl : '//www. DOMAIN0 NAME.com/channel.html', // Place domain here

Facebook javascript sdk in Phonegap with ios?

Here is my code
<html>
<head>
<head>
<title></title>
<script type="text/javascript" charset="utf-8" src="cordova-1.6.0.js"></script>
<script type="text/javascript">
function go()
{
FB.login(function(response) {
if (response.authResponse) {
console.log('Welcome! Fetching your information.... ');
FB.api('/me', function(response) {
console.log('Good to see you, ' + response.name + '.');
});
} else {
console.log('User cancelled login or did not fully authorize.');
}
});
}
</script>
<body>
<div id="fb-root">
</div>
<script>
window.fbAsyncInit = function() {
FB.init({
appId : '', // App ID
channelUrl : '', // Channel File
status : true, // check login status
cookie : true, // enable cookies to allow the server to access the session
xfbml : true, // parse XFBML
oauth : true //oauth v2.0
});
};
// 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>
<input onclick="go();" type='submit' id='login-button' value='Login' name='login' >
</body>
</html>
Basically you click the button and it should show you a login pop-up. It works when I try in a normal browser but when I try in the iPhone simulator nothing happens. Iv also set the iPhone browser to allow pop-ups. what am I doing wrong?
I got it working using the phonegap plugin called Childbrowser :)

FB Comments Plugin - Detect comment on page

How can I detect when a comment is made on my page with the Comments Plugin? I'm currently using the Facebook PHP SDK, reading the Facebook documentation it says I need the JS SDK, but it's not really clear on how you accomplish what I want to do.
I guess it's straight forward:
<div id="fb-root"></div>
<script>
window.fbAsyncInit = function() {
FB.init({
appId : 'YOUR_APP_ID', // App ID
channelURL : '//WWW.YOUR_DOMAIN.COM/channel.html', // Channel File
status : true, // check login status
cookie : true, // enable cookies to allow the server to access the session
oauth : true, // enable OAuth 2.0
xfbml : true // parse XFBML
});
FB.Event.subscribe('comment.create',
function(response) {
alert('A new comment has been added!');
}
);
};
// Load the SDK Asynchronously
(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));
</script>
Documents: 1 - 2

Categories