Question

Once a user has authorized my app I need to parse the signed request so I can access their user id etc. Where in my code do I put the url to the page that processes it? I need a code example. I've looked through the documentation and it doesn't explain clearly how to do this for a canvas app. The variable redirectUrl has the url of the canvas app itself. Is that supposed to contain the url of the code that parses the signed request instead? I'm not sure.

<body>
 <div id="fb-root"></div>
  <script type="text/javascript">

   $(document).ready(function(){


    var appId = 278*****2040;

    // If logging in as a Facebook canvas application use this URL.
    var redirectUrl = "http://apps.facebook.com/MYAPP";

    // If the user did not grant the app authorization go ahead and
    // tell them that. Stop code execution.
    if (0 <= window.location.href.indexOf ("error_reason"))
    {
    $('#authCancel').empty();    
     $(document.body).append ("<p>Authorization denied!</p>");
     return;
    }


    // When the Facebook SDK script has finished loading init the
    // SDK and then get the login status of the user. The status is
    // reported in the handler.
    window.fbAsyncInit = function(){

     //debugger;

     FB.init({
      appId : 278****40,
      status : true,
      cookie : true,
      oauth : true
      });

     // Sandbox Mode must be disabled in the application's settings
     // otherwise the callback will never be invoked. Monitoring network
     // traffic will show an error message in the response. Change the
     // Sandbox Mode setting in: App Settings - Advanced - Authentication.
     FB.getLoginStatus (onCheckLoginStatus);
    };


    // Loads the Facebook SDK script.
    (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));


    // Handles the response from getting the user's login status.
    // If the user is logged in and the app is authorized go ahead
    // and start running the application. If they are not logged in
    // then redirect to the auth dialog.

    function onCheckLoginStatus (response)
    {
     if (response.status != "connected")
     {
      top.location.href = "https://www.facebook.com/dialog/oauth?client_id=" + appId + "&redirect_uri=" + encodeURIComponent (redirectUrl) + "&scope=user_photos,friends_photos";
     }
     else
     {
      // Start the application (this is just demo code)!
      $(document.body).append ("<p>Authorized!</p>");
      FB.api('/me', function (response) {

      $(document.body).append ("<pre>" + JSON.stringify (response, null, "\t") + "</pre>");
      });
     }
    }
   });

  </script>
Was it helpful?

Solution

You can definitely use canvas page URL itself. IN the same page you can put the following code. I have done that and working perfectly fine.

if(isset($_REQUEST["code"]))
{

$code = $_REQUEST["code"];

    $my_url = "https://apps.facebook.com/CANVAS_APP_URL/";
    $token_url = "https://graph.facebook.com/oauth/access_token?". "client_id=" . $app_id . "&redirect_uri=" . urlencode($my_url)
    . "&client_secret=" . $app_secret . "&code=" . $code;

        $ch = curl_init();
        curl_setopt($ch, CURLOPT_URL, $token_url );
        curl_setopt($ch, CURLOPT_RETURNTRANSFER, 1);
        $output1 = curl_exec($ch);
        curl_close($ch);

    $tokenarray = explode("&", $output1);
    $tokenarray1 = explode("=", $tokenarray[0]); 

    $access_token = $tokenarray1[1];

    $urltoopen = 'https://graph.facebook.com/me?access_token=' . $access_token;

    $ch = curl_init();
        curl_setopt($ch, CURLOPT_URL, $urltoopen);
        curl_setopt($ch, CURLOPT_RETURNTRANSFER, 1);
        $output = curl_exec($ch);
        curl_close($ch);

    echo $output;

 }

Hope this helps !!

~ ABW

Licensed under: CC-BY-SA with attribution
Not affiliated with StackOverflow
scroll top