Facebook Page Tab App signed_request app_data missing - javascript

I'm developing a Facebook Page Tab App - using Javascript SDK - which, on load, should show the contents of the signed_request posted by Facebook to my App. This signed_request should contain the "app_data" parameter, which is passed in the URL, like this:
http_//www.facebook.com/pages/MyPage-Community/SOME_ID?sk=MY_APP_ID&app_data=this_is_my_data
The link:
MyPage-Community is a temporary Fan Page, which is published
SOME_ID is, I guess, the page ID
MY_APP_ID contains the app ID given by Facebook
app_data=this_is_my_data (what I need)
Notes:
The app itself is NOT in Development mode, so it's publicly available
I'm using localhost to test the app
I've tested with the developer account AND with a real regular account (set as App Tester, thus authorized)
Now, in the app code (javascript), I'm calling FB.getLoginStatus(...), which gives me the authResponse object that contains, among other stuff, the signedRequest property - this one, when decoded, shows me these key/value pairs:
[algorithm] => HMAC-SHA256
[code] => SOME_CODED_STRING
[issued_at] => 1403183583
[user_id] => XXXXXXXXXXXXXXX (my user id)
As you can see, the app_data property is not present as it was supposed to - as page should too, but I don't really need that one. Any ideas why this is happening? Can't find an answer anywhere. Could it be because I'm using localhost? Everything else seems to be working (although I do get an error when I try to "like" the page from within the app).
Thanks!

I think you're confusing the signed request which is POST'ed to your app and the signedRequest parameter of the response to the JS SDK's getLoginStatus method - they're not the same thing but are named similarly because they have a similar purpose
The JS SDK returns values more or less equivalent to what you receive on a Facebook canvas app, but it's not the same source of data or delivery mechanism, and won't have the same fields
To read the actual signed request with the page and app_data, you need to do it server side - instructions for which are here: https://developers.facebook.com/docs/facebook-login/using-login-with-games#checklogin (It applies to page tab apps as well as canvas app)

Related

Why does a Cloud Function for Firebase (deployed without errors), throw "Uncaught (in promise) FirebaseError: internal" when called? [duplicate]

After months of developing a Web App under Firebase suddenly these days we have a problem with the Authentication, it returns this console.alert only with Facebook and google login (email/pass login works fine):
[firebase-auth] Info: The current domain is not authorized for OAuth
operations. This will prevent signInWithPopup, signInWithRedirect,
linkWithPopup and linkWithRedirect from working. Add your domain
(front.qualify.mx) to the OAuth redirect domains list in the Firebase
console -> Auth section -> Sign in method tab.
The App uses 3 different sub-domains, and in all 3 we can access over email/pass but not Facebook nor google.
We tried updating the Firebase initialization script, nothing. We have checked the API keys (in the Google APIs Credentials) and there was a new "Server key (auto created by Google Service)" which no one told us it was generated (Jan. 18th), so we edited it to include the domains as the original API key in different ways (w/wo * and /*), nothing. We deleted this new Server Key, suddenly something different, now the console includes a 403 error before the alert stated above and returns auth/timeout code inside the object.
We also found the Identity Toolkit API has detected many errors, so we tried to add the URLs for login, logout and email, but nothing happens when trying to save.
What are we missing?
The solution was adding my-app.firebaseapp.com (being my-app the unique identifier of our Firebase App) to the HTTP referrers in the Browser-Key Credentials from the Google APIs console and wait some time to propagate.
After many months of development the app never had a problem, and we are sure we never removed such referrer (if it was ever there).
Anyway... it's done and learned.
The simple way I was able to solve this issue I had with my ionic project was by following the instructions in the log, if you don't see any message try console log the response from firebase.
So what I simply did was follow the url: https://console.developers.google.com/apis/api/identitytoolkit.googleapis.com/overview?project='projectId'
*projectId = the Id of your project
and enable the Identity API something it brought up. Finish, and it worked instantly.

Access facebook canvas URL parameters from my app

I'm making a facebook canvas app (a game) and I want my players to use links with url parameters that link to different areas in the game, i.e.
https://apps.facebook.com/mgatlandtestapp?level=emeraldhillzone
How do I access the level=emeraldhillzone information in my app (either client-side with javascript in an iFrame, or server-side as a node.js application)
Things I've tried so far:
This 4-year-old answer says it's possible to in the client-side code but doesn't say how (sorry if I'm missing something obvious! window.location gives the location of my heroku server, not the facebook url.)
Some of the facebook documentation made me think this would work:
Use a url in the form https://apps.facebook.com/mgatlandtestapp?app_data=yourDataHere then on the server side get the signed request sent to the server and it will contain an app_data field.
However when I did this, the signed request did not contain an app_data field.
After reading more, I think the app_data thing only works if the app is being loaded within a facebook Page Tab, not a facebook Canvas Page.
Facebook sends an initial POST to your app, which includes the url parameters. You can access the url parameters from in that POST request.
I used this url to load the page:
https://apps.facebook.com/mgatlandtest/?level=emeraldhillzone
I used this code in my node.js server app to serve the request
app.post('/*', function(request, response) {
console.log('url parameters:');
console.log(request.query);
response.redirect('/');
});
The output in the node console was:
url parameters:
{ level: 'emeraldhillzone' }
You could then use the parameters to redirect to a different page.
This was actually really simple, once I got past all the distracting misinformation. The key was searching for 'deep linking' (instead of 'url parameters'), which brought up this answer

Facebook javascript api - One or more of the given URLs is not allowed by the App's settings

I have a simple application that I'm hosting on bluemix.
I have set up a Single Sign On service for my application and paired it with facebook. I can successfully log in using the SSO service from bluemix and then I want to check that status of my login (I am logged in or not).
function CheckStatus(){
console.log("I'm trying to check the status");
FB.getLoginStatus(function(response) {
console.log("Here is the status response:");
console.log(response.status);
});
}
I trigger this piece of code with a simple button defined before. Whenever I click the code I get the following error:
Given URL is not permitted by the application configuration.: One or more of the given URLs is not allowed by the App's settings. It
must match the Website URL or Canvas URL, or the domain must be a
subdomain of one of the App's domains.
I had a look at a number of posts on stackoverflow about this and none of them seem to work. My understanding is that there is something wrong with the configuration of my application but I can't figure out what.
Below is my configuration:
And this is the url my application is trying to reach when I try to get my login status:
https://www.facebook.com/connect/ping?client_id=913147408730179&domain=fncsecuritydemo.mybluemix.net&origin=1&redirect_uri=http%3A%2F%2Fstatic.ak.facebook.com%2Fconnect%2Fxd_arbiter%2FrFG58m7xAig.js%3Fversion%3D41%23cb%3Df29b5c6b3%26domain%3Dfncsecuritydemo.mybluemix.net%26origin%3Dhttp%253A%252F%252Ffncsecuritydemo.mybluemix.net%252Ff21657f8dc%26relation%3Dparent&response_type=token%2Csigned_request%2Ccode&sdk=joey
I am out of ideas about what I should be trying next. Any help is very much apreaciated. Let me know if you need more info.
The answer for this error lies in the Valid OAuth redirect URIs that fall under the Advanced tab from settings.
While setting up the application profile on facebook I have set the Valid OAuth redirect URIs to an URL generated by bluemix.
In order to received response on my application I had to add my app url in there as well. Rookie mistake.

Google OAuth WildCard Domains

I am using the google auth but keep getting an origin mismatch. The project I am working has sub domains that are generated by the user. So for example there can be:
john.example.com
henry.example.com
larry.example.com
In my app settings I have one of my origins being http://*.example.com but I get an origin mismatch. Is there a way to solve this? Btw my code looks like this:
gapi.auth.authorize({
client_id : 'xxxxx.apps.googleusercontent.com',
scope : ['https://www.googleapis.com/auth/plus.me',
state: 'http://henry.example.com',
'https://www.googleapis.com/auth/userinfo.email', 'https://www.googleapis.com/auth/userinfo.profile'],
immediate : false
}, function(result) {
if (result != null) {
gapi.client.load('oath2', 'v2', function() {
console.log(gapi.client);
gapi.client.oauth2.userinfo.get().execute(function(resp) {
console.log(resp);
});
});
}
});
Hooray for useful yet unnecessary workarounds (thanks for complicating yourself into a corner Google)....
I was using Google Drive using the javascript api to open up the file picker, retrieve the file info/url and then download it using curl to my server. Once I finally realized that all my wildcard domains would have to be registered, I about had a stroke.
What I do now is the following (this is my use case, cater it to yours as you need to)
On the page that you are on, create an onclick event to open up a new window in a specific domain (https://googledrive.example.com/oauth/index.php?unique_token={some unique token}).
On the new popup I did all my google drive authentication, had a button to click which opened the file picker, then retrieved at least the metadata that I needed from the file. Then I stored the token (primary key), access_token, downloadurl and filename in my database (MySQL).
Back on step one's page, I created a setTimeout() loop that would run an ajax call every second with that same unique_token to check when it had been entered in the database. Once it finds it, I kill the loop and then retrieve the contents and do with them as I will (in this case I uploaded them through a separate upload script that uses curl to fetch the file).
This is obviously not the best method for handling this, but it's better than entering each and every subdomain into googles cloud console. I bet you can probably do this with googles server side oauth libraries they use, but my use case was a little complicated and I was cranky cause I was frustrated at the past 4 days I've spent on a silly little integration with google.
Wildcard origins are not supported, same for redirect URIs.
The fact that you can register a wildcard origin is a bug.
You can use the state parameter, but be very careful with that, make sure you don't create an open redirector (an endpoint that can redirect to any arbitrary URL).

Is it possible to use an existing Facebook Connect session with Facebooker?

Update: Working as designed once I cleared my cookies. Doh!
I'm working on an app that for various reasons uses the Facebook
Javascript API to initiate a Facebook connect session. I'd like to be
able to use that session in a few rails methods using Facebooker.
The basic workflow is like this:
User goes to non-rails page and logs in to FB Connect via JS
User goes to another non-rails page and can view FB data such as
name, profile pic
User goes to a rails based page - rails uses session created in
step 1 to do some processing
My problem is in step 3. Facebooker detects the session fine, but when
I try to call a method like facebook_session.user.name I get: Session
key invalid or no longer valid
If I go back to the url in step two, my session still works fine.
So is this a fundamental incompatibility, or is there some data I can
send to facebooker so that I can hook into the correct session? Maybe
my facebooker.yml needs tweaking?
Any thoughts are appreciated.
My facebooker.yml
development:
api_key: redacted
secret_key: redacted
canvas_page_name: blah_blah
callback_url: http://test.domain:3000
pretty_errors: true
set_asset_host_to_callback_url: true
tunnel:
public_host_username:
public_host:
public_port: 4007
local_port: 3000
server_alive_interval: 0
Gah! Always clear your cookies before posting on the interweb people.
The problem was with an existing facebooker-based session that was still around in my browser.
All working now.

Categories

Resources