CODEWITHSUNDEEP
javascriptfacebookoauth
Ostap Hnatyuk
Ostap Hnatyuk

Reputation: 1276

Facebook OAuth programming, trying to get a user to authenticate

I am trying to do this tutorial https://developers.facebook.com/docs/howtos/login/getting-started/

I have done everything necessary(I think) that this tutorial as provided. It's goal is to let your webpage authenticate a user's Facebook info using OAuth.

The code of my HTML is as follows...

<html>
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.0/jquery.min.js" type="text/javascript"></script>
<script type="text/javascript">
function main(){ // runs all the other methods when needed, and maintains the proper path from making the form to posting to Facebook
    var imageURL = getImageURL();
    $("img[src='" + imageURL + "']").after("</br><form><input type=\"checkbox\" name=\"geo\" value=\"geolocation\"><b>Use Geolocation?</b> </br> <b>Additional Information About the Image: </b> <input type=\"comment\" name=\"cmnt\"></form>");
    alert("Form should have been placed.");
}

function getImageURL(){
    var url = "http://upload.wikimedia.org/wikipedia/commons/thumb/2/21/Solid_black.svg/200px-Solid_black.svg.png";
    return url;
}

function login() {
    FB.login(function(response) {
        if (response.authResponse) {
            // connected
            testAPI();
        } else {
            // cancelled
        }
    });
}

function testAPI() {
    alert('Welcome!  Fetching your information.... ');
    FB.api('/me', function(response) {
        alert('Good to see you, ' + response.name + '.');
    });
}
</script>
</head>
<body onload="main()">
    <div id="fb-root"></div>
    <script>
  //-----------------------------
  // This is an initilization script created by Facebook. 
  //-----------------------------
  // Additional JS functions here
  window.fbAsyncInit = function() {
FB.init({
  appId      : 'hiddenappid', // App ID
  channelUrl : 'hiddenwebpage', // Channel File
  status     : true, // check login status
  cookie     : true, // enable cookies to allow the server to access the session
  xfbml      : true  // parse XFBML
});

    // Additional init code here
    FB.getLoginStatus(function(response) {
        if (response.status === 'connected') {
            // connected
        } else if (response.status === 'not_authorized') {
            // not_authorized
            login();
        } else {
            // not_logged_in
            login();
        }
    });
   };

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

<b> Page </b>
<img src="http://upload.wikimedia.org/wikipedia/commons/thumb/2/21/Solid_black.svg/200px-Solid_black.svg.png">

</body>
</html>

It's a bit of code, but it's mainly all the code from the tutorial. You could basically ignore the rest.

I'm just wondering how do I make this authentication script run? When I start the page nothing happens.

Additionally I'm not running this from an actual webpage, I'm just running the html file. I'm also behind a proxy if that could affect it. Thanks in advance!

Upvotes: 0

Views: 153

Answers (1)

Geuis
Geuis

Reputation: 42297

The page has to be publicly accessible, and the URL you define in your Facebook app has to match the url being accessed. Just ran into this same setup the other day for my test site, http://omgtrolls.com

Upvotes: 1

Related Questions