CODEWITHSUNDEEP
phpjavascriptfacebookfacebook-javascript-sdk
martin's
martin's

Reputation: 3955

How to call a php page from Facebook "like" button JS code?

I looked through some answers and I can't seem to get anything to work. Now I am wondering if this is because the site I am working on is currently only visible locally through XAMPP.

Here are a couple of code snippets of what I've tried:

<script> 
  FB.Event.subscribe('edge.create', location.href = 'test.php');
</script>

and

FB.Event.subscribe('edge.create', function(response) {
    var xmlhttp = new XMLHttpRequest();
    xmlhttp.open("POST", "test.php", true);
    xmlhttp.send(); 
});

The facebook code seems to run but my php page is never called. Even a simple alert('You liked the URL: '); doesn't work. I can "like" the page and it shows-up in my FB wall as such.

This is what I have right after the body tag (copy-paste from FB):

<div id="fb-root"></div>
<script>(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#xfbml=1";
  fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>

I saw a post somewhere claiming that if the URL being liked didn't match the URL where the button was clicked from this would not work. Well, I am clicking from "www.site-name.local" when the real URL is a .com. It seems to work as far as the liked URL showing-up on my FB wall but the even does not fire.

I just checked the Firebug console and I get:

FB is not defined
    FB.Event.subscribe('edge.create',

I'd appreciate a shove in the right direction.

Upvotes: 0

Views: 1435

Answers (2)

martin&#39;s
martin&#39;s

Reputation: 3955

OK, here's the solution. It may not be THE solution, but it worked for me.

The code and explanation posted on the FB Dev site here:

http://developers.facebook.com/docs/guides/web/

<html>
  <head>
    <title>My Great Web page</title>
    </head>
    <body>
      <div id="fb-root"></div>
    <script>
      (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#xfbml=1";
       fjs.parentNode.insertBefore(js, fjs);
      }(document, 'script', 'facebook-jssdk'));
    </script>
    <div class="fb-like"></div>
    </body>
 </html>

Worked fine as far as later on being able to "like" a page and having that show-up on FB, but it did not trigger any action once the button is clicked.

I decided to go get an App ID for the site. This made it all work.

The new code looks like this:

<script>
window.fbAsyncInit = function() {
  FB.init({
    appId      : 'my_app_ID_number', // App ID
    status     : true, 
    cookie     : true,
    xfbml      : true,
    oauth      : true,
  });
  // Additional initialization code here

  // Get notified when user likes this
  FB.Event.subscribe('edge.create', function(response){location.href = 'test.php'});            
};

// 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));

I had to place "FB.Event.subscribe" within this code block or it would cause an error. "FB.Event.subscribe" seemed to run before "FB.init" got a chance to do its job. Not sure how you'd go about doing this if you had multiple "Like" buttons on a single page.

Anyhow, this worked for me.

Upvotes: 1

DMCS
DMCS

Reputation: 31860

Be sure FB.init is called before the FB.Event.subscribe can fire.

Upvotes: 1

Related Questions