Facebook application - get signed_request with JavaScript

Question

I have a FaceBook application.

Is there any way to get signed_request with JavaScript?

With PHP it looks like this: $_REQUEST['signed_request'], but I can't use php.

Answer 1

From the Facebook documentation:

The signed request is sent via an HTTP POST to the URL set as your Canvas URL in the App Dashboard.

[emphasis by author]

You cannot access that POST data directly via JavaScript:

POST data is supposed to be received by the server. As a conclusion the browser does not grant access to that data accept the server renders the data in the client code. Related question: How to read POST request parameters using JavaScript

Now why is that so? I guess the reason is security: Imagine sending a password in a POST request to your server and some malicious JavaScript plugin you use in your app trying to read that data and send it to its own malicious server. That wouldn't be nice at all.

In your case the POST data including the signed_request is sent to your app via an HTTP POST by Facebook requesting your app's page via the Canvas URL you specified in the app dashboard or via the redirect URL you specified using the Registration plugin. You can access it via FB.getLoginStatus. The prerequisites are: You either are using a canvas app (you are "inside" Facebook, having a Page Tab or a Canvas App) or the Registration Plugin. Make sure to fetch the status on the URL you specified. Related questions: How do you post to an iframe? and getSignedRequest is null when not on a tab page

Also try to call FB.getLoginStatus with the second parameter set to true to force a roundtrip to Facebook - effectively refreshing the cache of the response object and resolving issues with users having logged into (or out of) Facebook since the last full session lookup or having removed your application in their account settings:

FB.getLoginStatus(function(response) {
  // this will be called when the roundtrip to Facebook has completed
}, true);

Also check out this question - it might help: Facebook iframe tab signed request always empty

Answer 2

From the FB JavaScript SDK, you can use FB.getLoginStatus to retrieve the signed_request.

That is if the the user is logged into your app/website.

If not you can call the FB.login method.

Ref: http://developers.facebook.com/docs/reference/javascript/FB.getLoginStatus/

FOLLOWING ON TO YOUR COMMENT:

Hi,

I think you should try to log the response to your console.

The response.status should equal 'connected' if the user is logged. It will always return true, as a value will be returned in this response param.

The log will look like so

{
    status: 'connected',
    authResponse: {
        accessToken: '...',
        expiresIn:'...',
        signedRequest:'...',
        userID:'...'
    }
}

To test what is being return try this:

if(response.status == 'connected'){
   // user is logged and signed_request is accessible
   // with response.authResponse.signedRequest
}else{
   // user not logged in, request them to login
      FB.login(function(response){ ... });
}

Answer 3

getting the signed request using javascript from facebook is different from the value on $_REQUEST['signed_request']

what you can do is store $_REQUEST['signed_request'] to a javascript variable and pass it via ajax to php.

for example

var signedRequest = <?php echo $_REQUEST['signed_request']  ?>

//then fire a jsonp request..

you can use my service though if you want.

HOW TO USE: just fire a jsonp request to this

https://websta.me/fbappservice/parseSignedRequest/<append signed request here>

if success it will return something like this

{
"algorithm": "HMAC-SHA256",
"issued_at": xxxxx,
"page": {
    "id": "xxxxxxx",
    "admin": true,
    "liked": false
},
"user": {
    "country": "jp",
    "locale": "en_US",
    "age": {
        "min": xx
    }
}

if failed it will output:

Bad signed Json Signature

happy coding!!