Login thru LinkedIn / Facebook

I'm trying to figure out a way to do a login to a web site thru  LinkedIn.

I've gone on the web & found nothing that I can understand; there is talk of Oauth, I am also trying to do it with Facebook, have another question open on EE for that, no answer that works.

Can someone point me to a WORKING example of how to do that?

I have a Linked in Account; I could try it myself.

Also, Facebook.

A lot of sites have this, I can't see why it's so hard to do.

Thanks
Richard KortsBusiness Owner / Chief DeveloperAsked:
Who is Participating?

[Product update] Infrastructure Analysis Tool is now available with Business Accounts.Learn More

x
I wear a lot of hats...

"The solutions and answers provided on Experts Exchange have been extremely helpful to me over the last few years. I wear a lot of hats - Developer, Database Administrator, Help Desk, etc., so I know a lot of things but not a lot about one thing. Experts Exchange gives me answers from people who do know a lot about one thing, in a easy to use platform." -Todd S.

William FulksSystems Analyst & WebmasterCommented:
0
Leslie BloomCorporate & Product Marketing ManagerCommented:
0
Richard KortsBusiness Owner / Chief DeveloperAuthor Commented:
To William Fulks,

I'm totally confused. Part of that is what I tried before. See attached. Note that for EE purposes, I removed the REAL facebook AppID and put in xxxxxxxx

I use this & I get the attached error message.

What's wrong?
fb-login-example-no-app-code.htm
fb-login-error.jpg
0
OWASP: Threats Fundamentals

Learn the top ten threats that are present in modern web-application development and how to protect your business from them.

Richard KortsBusiness Owner / Chief DeveloperAuthor Commented:
To Leslie Bloom,

I had already found that. I understood that I needed an AppID (like with Facebook). I tried to do that, they ask all kinds of questions about OAuth, etc., https, etc. I have NO CLUE what they are talking about.

I just want a SIMPLE way for clients to log into a login protected part of a web site through LinkedIn or Facebook.

Why is it so DIFFICULT!!!
0
Richard KortsBusiness Owner / Chief DeveloperAuthor Commented:
To Leslie Bloom,

In  http://requests-oauthlib.readthedocs.org/en/latest/examples/linkedin.html when they talk about the "command line interface", I want to do this from an html / Javascript page.

Are they talking about the command line on a linux server?
0
F PCommented:
They're talking about using Python's command line.
0
F PCommented:
0
Richard KortsBusiness Owner / Chief DeveloperAuthor Commented:
To Frank Pennock,

I am COMPLETELY confused by that stuff.
0
F PCommented:
You read through the comments here:

https://github.com/petewarden/linkedinoauthexample/blob/master/index.php

and you're still confused?
0
Richard KortsBusiness Owner / Chief DeveloperAuthor Commented:
Frank Pennock

Ok, consider that I am an idiot.

That stuff tells me NOTHING. I know enough about php to know that the require once statements are referencing external php files that are not there, I have NO idea how to get them, I have NO IDEA how to integrate this stuff into an html page with a button that says "Logon through LinkedIN", etc.

It may be obvious to all of you but I have NO CLUE.

I'll probably close this question & try again, starting only with FaceBook.
0
William FulksSystems Analyst & WebmasterCommented:
Frank, for starters this is PHP and not HTML. Check with your web host to make sure they support PHP. If you're trying to run this locally (off your hard drive) then it won't work.

This stuff is definitely complicated, but it should be! You're dealing with passing authentication to remote sites and if it were that simple then people could easily swipe other's Facebook passwords. There are already scam sites designed to do just that.

Try renaming your file from .html to .php and upload it to your web host, then see if it works any better. You may also want to check with your web host to make sure they support what you're trying to do.
0
F PCommented:
Well, I asked because the comments on that link walk you through it step by step explaining what each and every little piece does and why it's there.
0
F PCommented:
I think you meant that for someone else William?
0
William FulksSystems Analyst & WebmasterCommented:
Sorry, that was for Richard, not Frank. :)
0
Richard KortsBusiness Owner / Chief DeveloperAuthor Commented:
Are you referring to the file I originally uploaded or something else?

Attached again is the original.

Thanks
fb-login-example-no-app-code.htm
0
F PCommented:
This worked for me on my domain without any issues, and the only things I changed were the http:// in front of connect.facebook.com in the script, and I used version 2.3 of the API, since the code says 2.2 and my app is 2.3.... Hope it helps (If you're using Chrome, open the developer tools and look at the console, in any other browser make sure you open the console in your developer tools to see what happens when you login. It also must be from the domain identified in the app ID):

<!DOCTYPE html>
<html>
<head>
<title>Facebook Login JavaScript Example</title>
<meta charset="UTF-8">
</head>
<body>
<script>
  // This is called with the results from from FB.getLoginStatus().
  function statusChangeCallback(response) {
    console.log('statusChangeCallback');
    console.log(response);
    // The response object is returned with a status field that lets the
    // app know the current login status of the person.
    // Full docs on the response object can be found in the documentation
    // for FB.getLoginStatus().
    if (response.status === 'connected') {
      // Logged into your app and Facebook.
      testAPI();
    } else if (response.status === 'not_authorized') {
      // The person is logged into Facebook, but not your app.
      document.getElementById('status').innerHTML = 'Please log ' +
        'into this app.';
    } else {
      // The person is not logged into Facebook, so we're not sure if
      // they are logged into this app or not.
      document.getElementById('status').innerHTML = 'Please log ' +
        'into Facebook.';
    }
  }

  // This function is called when someone finishes with the Login
  // Button.  See the onlogin handler attached to it in the sample
  // code below.
  function checkLoginState() {
    FB.getLoginStatus(function(response) {
      statusChangeCallback(response);
    });
  }

  window.fbAsyncInit = function() {
  FB.init({
    appId      : '669############',
    cookie     : true,  // enable cookies to allow the server to access
                        // the session
    xfbml      : true,  // parse social plugins on this page
    version    : 'v2.3' // use version 2.2
  });

  // Now that we've initialized the JavaScript SDK, we call
  // FB.getLoginStatus().  This function gets the state of the
  // person visiting this page and can return one of three states to
  // the callback you provide.  They can be:
  //
  // 1. Logged into your app ('connected')
  // 2. Logged into Facebook, but not your app ('not_authorized')
  // 3. Not logged into Facebook and can't tell if they are logged into
  //    your app or not.
  //
  // These three cases are handled in the callback function.

  FB.getLoginStatus(function(response) {
    statusChangeCallback(response);
  });

  };

  // 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 = "http://connect.facebook.net/en_US/sdk.js";
    fjs.parentNode.insertBefore(js, fjs);
  }(document, 'script', 'facebook-jssdk'));

  // Here we run a very simple test of the Graph API after login is
  // successful.  See statusChangeCallback() for when this call is made.
  function testAPI() {
    console.log('Welcome!  Fetching your information.... ');
    FB.api('/me', function(response) {
      console.log('Successful login for: ' + response.name);
      document.getElementById('status').innerHTML =
        'Thanks for logging in, ' + response.name + '!';
    });
  }
</script>

<!--
  Below we include the Login Button social plugin. This button uses
  the JavaScript SDK to present a graphical Login button that triggers
  the FB.login() function when clicked.
-->

<fb:login-button scope="public_profile,email" onlogin="checkLoginState();">
</fb:login-button>

<div id="status">
</div>

</body>
</html>

Open in new window

0

Experts Exchange Solution brought to you by

Your issues matter to us.

Facing a tech roadblock? Get the help and guidance you need from experienced professionals who care. Ask your question anytime, anywhere, with no hassle.

Start your 7-day free trial
F PCommented:
I think a better question might also be, what are you hoping to accomplish with this once the user is logged in?
0
Richard KortsBusiness Owner / Chief DeveloperAuthor Commented:
Frank Pennock,

Thanks, I'll try your version later today.

Richard
0
Richard KortsBusiness Owner / Chief DeveloperAuthor Commented:
It WORKS!! (your version)

Thanks!
0
F PCommented:
Great!
0
It's more than this solution.Get answers and train to solve all your tech problems - anytime, anywhere.Try it for free Edge Out The Competitionfor your dream job with proven skills and certifications.Get started today Stand Outas the employee with proven skills.Start learning today for free Move Your Career Forwardwith certification training in the latest technologies.Start your trial today
Facebook

From novice to tech pro — start learning today.