我使用哪个Facebook登录按钮，为什么？

Question

I have began developing a website which has facebook integration and it seems to work ok while using the Javascript SDK. I shown users name and profile pic fine. Then I read everywhere its best to use JS to make a auth connection and use the PHP SDK to run the API as its easier.

So I was faced with using one of two different login approaches, but for the life of me I cant just get what I want out of it. It really seems like the documentation doesnt clearly explain the pros/cons of anything they describe, and what situation is best for what approach.

For example:

    <?php if (!$user) { ?>
    <div class="fb-login-button" data-perms="email,user_birthday">Login with Facebook</div>
<?php } else { ?>

    Your user profile is
    <pre>
    <?php //print htmlspecialchars(print_r($user_profile, true)) ?>
    </pre>

    <?php echo $user_profile['name']; ?>

    <?php
    $data = array("message" => "Hello Woghfd!");
    $status = $facebook->api("/me/feed", "POST", $data); 
    //echo $user;

    ?>
<?php } 

But then there is also the other button:

<fb:login-button scope="email,user_about_me">Connect Facebooks</fb:login-button>

And then the call to the JS function FB.login.

I wouldnt mind all of this but I am testing the ability to use PHP SDK to post to a users wall with this code:

$status = $facebook->api("/me/feed", "POST", $data);

And I keep getting an error message:

Fatal error: Uncaught OAuthException: (#200) The user hasn't authorized the application to perform this action

This is when I visit my website. Then when I log out, and log back in using my websites login button, it works. I obviously dont want this to happen for every user that visits the site.

Can someone please explain what all of these buttons mean? Ive spend a couple of days scouring the internet for explanations but things get confusing when the SDK updates are considered as I dont know what is the best approach anymore.

Thanks.

Answer 1

The documentation states:

Facebook Platform supports two different OAuth 2.0 flows for user login: server-side (known as the authentication code flow in the specification) and client-side (known as the implicit flow). The server-side flow is used whenever you need to call the Graph API from your web server. The client-side flow is used when you need to make calls to the Graph API from a client, such as JavaScript running in a Web browser or from a native mobile or desktop app.

Which makes it pretty clear: if you want to use the graph api from the server side then use the server side flow, if you want to make the api calls from the client side then use the client side flow. You can of course use the server side flow for authentication and then interact with the graph api via the js sdk, or the other way around, but it just makes more sense to do it as they wrote.

The use of the login buttons means using the client side flow with the help of the js sdk. The two different forms of buttons that you wrote are basically the same, as they say in the documentation :

Using the new JavaScript SDK, the plugin is available via the <fb:login-button> XFBML tag or the <div class="fb-login-button"> HTML tag.

As for the error message you get when trying to post on the user wall, I don't see in your example that you are requesting for the publish_stream permission which is needed in order to post on the users wall.