4

I'm in the process of developing a Contest and Promotion-related Facebook app and my intent is to to create a tab on my company's page that will provide access to the app.

Once their, users can nominate local companies for awards. Later on; once the nominations are in, users can vote for a winner.

I've integrated Open Graph into my app so that I can take advantage of Object Types (Organization), Action Types (Nominate, Vote For), and Aggregations (Nominations). My main objective is to then transfer these actions onto the user's timeline.

I've used the recipebox example as my base. I've provided my code to demonstrate authentication and the post action required to submit an action type/object type combination.

<html xmlns="http://www.w3.org/1999/xhtml" dir="ltr" lang="en-US"> 
<head prefix="og: http://ogp.me/ns# og_<<app namespace>>: http://ogp.me/ns/apps/<<app namespace>>#"> 
    <meta property="fb:app_id" content="<<app id>>" /> 
    <meta property="og:type" content="<<app namespace>>:organization" /> 
    <meta property="og:title" content="Client 1" /> 
    <meta property="og:image" content="<<client image path>>" /> 
    <meta property="og:description" content="Client 1 description here ... " /> 
    <meta property="og:url" content="<<custom client URL>>">
    <script src="http://connect.facebook.net/en_US/all.js"></script>
    <script type="text/javascript">
        // 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));

        // Init the SDK upon load
        window.fbAsyncInit = function() {
            FB.init({
                appId      : '<<app id>>', // App ID
                status     : true, // check login status
                cookie     : true, // enable cookies to allow the server to access the session
                xfbml      : true  // parse XFBML
            });

            // listen for and handle auth.statusChange events
            FB.Event.subscribe('auth.statusChange', function(response) {
                if (response.authResponse) {
                    // user has auth'd your app and is logged into Facebook
                    FB.api('/me', function(me){
                        if (me.name) {
                            document.getElementById('auth-displayname').innerHTML = me.name;
                        }
                    })
                    document.getElementById('auth-loggedout').style.display = 'none';
                    document.getElementById('auth-loggedin').style.display = 'block';
                } else {
                    // user has not auth'd your app, or is not logged into Facebook
                    document.getElementById('auth-loggedout').style.display = 'block';
                    document.getElementById('auth-loggedin').style.display = 'none';
                }
            });

            // respond to clicks on the login and logout links
            document.getElementById('auth-loginlink').addEventListener('click', function(){
                FB.login();
            });
            document.getElementById('auth-logoutlink').addEventListener('click', function(){
                FB.logout();
            });
        }       

        function nominate () {
            FB.api('/me/<<app namespace>>:Nominate&organization=<<custom client URL>>', 'post',  function(response) {

                if (! response || response.error) {
                    alert('Error occured');
                    console.log(response);
                } else {
                    alert('Post was successful! Action ID: ' + response.id);
                }
            });
        }
    </script>
</head> 
<body> 
    <div id="fb-root"></div>
    <div id="auth-status">
        <div id="auth-loggedout">
            <a href="#" id="auth-loginlink">Login</a>
        </div>
        <div id="auth-loggedin" style="display:none">
            Hi, <span id="auth-displayname"></span>  
            (<a href="#" id="auth-logoutlink">logout</a>)
        </div>
    </div>
    <h2>Client 1</h2> 
    <form>
        <input type="button" value="Nominate" onclick="nominate()" />
    </form> 
    <fb:activity actions="<<app namespace>>:nominate"></fb:activity>
</body> 
</html>

A test user is encountering the following error:

Requires extended permission: publish_actions

And I am encountering the following error (I am an Admin for this app):

This method must be called with an app access_token

The first error is troubling to me. I cannot select publish_actions from Apps | <My App> | Permissions | Extended Permissions. Also, remedies I've encounted suggest I re-categorize my app to Games (this does not work) and to complete my Aggregations (I did; still does not work).

  1. How can I overcome this error?
  2. What can I do to fix my This method must be called with an app access_token error?

Thanks in advance,

Mike

EDIT

I believe the access_token error I was encountering was due to the fact that I was testing/interacting with the app directly on the Page Tab URL; not through Facebook.

I am no longer receiving the Requires extended permission: publish_actions error; however, my testers and developers are. I know that I am encountering this error because the publish_actions permission is not requested at the initial facebook.com login prompt.

If my Developers/Testers logout of Facebook, then log back in with my prompt:

FB.login(function (response) { }, { scope:'publish_actions'});

Then this permission and app is integrated into their Facebook session.

My final question is- is there a defacto, preferred method to request this permission without logging in/out of Facebook?

mykisscool
  • 852
  • 2
  • 9
  • 24
  • I can only see you call `FB.login()`, without any `scope` parameter – so where do you expect the permission `publish_actions` to be actually granted? – CBroe Aug 24 '12 at 09:11

2 Answers2

2

I have fixed both of my errors. Thank you to those who provided me with feedback and put me on the right path.

These errors have been resolved:

1. Requires extended permission: publish_actions

2. This method must be called with an app access_token

For starters, CBroe is right. Since I require extended permissions (publish_actions) I need to specify this is my options object after the callback function in FB.login() like so:

FB.login(function (response) {
    if (response.authResponse) { // The user has authenticated
        authenticatedSoDoSomething();
    } 
    else { // The user has not authenticated
        notAuthenticatedSoDoSomethingElse(); 
    }
}, { scope:'publish_actions' });

Lastly, I had no success using the JavaScript SDK to publish an action to a user's timeline via FB.api(). This is the code I was using:

FB.api('/me/<<app namespace>>:<<my action>>&<<my object>>=<<a URL>>', 'post',
    function(response) {
        if (! response || response.error) {
            alert('Error occured');
        } else {
            alert('Post was successful! Action ID: ' + response.id);
        }
})

I neglected to include the app access token. The app access token can be constructed by concatenating the app id, followed by a pipe, followed by the app secret.

I used the PHP SDK to fulfill this request as I wanted to keep my api secret a secret. Here is [most] of the code I used:

require_once('facebook-php-sdk/src/facebook.php');

$facebook = new Facebook(
    array(
        'appId' => '<<my app id>>', 
        'secret' => '<<my app secret>>'));

$user = $facebook->getUser();

if ($user) {
    try {
        $user_profile = $facebook->api('/me');
    } 
    catch (FacebookApiException $e) {
        error_log($e);
        $user = null;
        echo json_encode(array('success' => false));
    }
}

try {
    $facebook->api('/' . $user . '/<<app namespace>>:<<my action>>&<<my object>>=<<a URL>>', 'POST', array('access_token' => $facebook->getAppId() . '|' . $facebook->getApiSecret()));
}
catch (FacebookApiException $e) {
    echo var_dump($e->getResult());
}

Hope this helps!

mykisscool
  • 852
  • 2
  • 9
  • 24
0

For the second one, make the call with your App Access Token like the error says; if you're already doing this and it's failing, check the app isn't set to 'Native/Desktop' mode in the app's settings in the facebook App Dashboard. If it is, the app access token is untrusted and the API acts as though you didn't provide it.

For the first, are you sure users are granting publish_actions permission to your app? A call to /me/permissions with the user's access token will show you which permissions are granted. Note that the authenticated referrals / app center login flow is separate to your app's regular flow for users that end up there other than via an authenticated referral or the app center, so check you're including publish_actions in the scope in your call to the Oauth Dialog.

Igy
  • 43,710
  • 8
  • 89
  • 115