I've created a Facebook page for my business and have created a 'Jobs' tab which will pull in content from my HTTPS Codeigniter powered website.
What Facebook does is request the page via an HTTP POST request, which is resulting in a 403 Forbidden error with the message "An Error Was Encountered - The action you have requested is not allowed.".
Additional info: I'm running Codeigniter 3 and Nginx.
Anyone know how I can get the page showing within Facebook?
1)You should check if the requested url is correct. I sometimes use Postman extension for Chrome to do that.
2) If you call from Facebook with ajax, you should know that ajax does not allow cross-domain calling by default. The easy solution would be to use GET method to send the data, and no ajax.(There are some ticks to make cross domain calls with ajax too, but I'll get into detail only if necessary)
Fixed!!! Simply by disabling CSRF protection for the page in question. Simple as that.
Related
I'm getting a 404 error when trying to add a Facebook Page Tab using a URL from a Squarespace hosted (using a custom domain) site.
I've followed these instructions - https://developers.facebook.com/docs/pages/tabs - and everything went fine, except when I click on the Page Tab it shows a 404 error page instead of the URL entered.
I tried the URL with and without the trailing slash, but it made no difference.
I also tried an alternative URL from a non Squarespace hosted site and that worked fine.
Are there additional steps I need to take because I'm using Squarespace?
For future readers...
Using Facebook Page Tabs isn't possible unless the URL is HTTPS and supports POST requests.
In the case of Squarespace, they have their own method of implementing Facebook Page Tabs, which is documented here - https://support.squarespace.com/hc/en-us/articles/206543737-Adding-Squarespace-tabs-to-Facebook
I developed a facebook fan page app with PHP SDK and am successfully running it. I have a Fan Gate implemented, that is, users have to like the page before they can use the app.
What I could not solve until yet is this: I would like to prevent my app from running outside of the Facebook iframe. As of now my app can run in a new browser tab or window, when a user copies and pastes the URL (of the iframe src). At this point I'd like to give an error message like "This app can only run in a Facebook tab".
I am catching the signed_request but as my app has subpages and routines, I have to store the signed_request in a session variable.
Any advices?
Ok, so what I usually do is provide data in the app_data field of signed_request to know which page to load. When POSTing, I redirect to the tab directly after processing the payload.
So, there are two methods a page, that is actually a facebook tab, may be requested: GET and POST.
GET
When using GET, the tab should always be requested using a facebook URL. For example: The tab's subpage "form" should have a URL like: http://www.facebook.com/pages/xXx/[page_id]?sk=app_[app_id]&app_data=form
In your server-side code you recognize the data in app_data after decoding the signed_request (see 1 and 2).
In your links to the form page, you also have to add the target="parent" attribute.
By this, facebook is reloaded and the tab feels slower than when you directly link the subpages. But you have URLs that identify a subpage, which is what we prefer.
Additionally, you can expect every GET request to have a signed_request. If it doesn't, it is not called via facebook and you can either show an error message or, what I suggest, redirect to you tab (sub-page).
POST
POSTs never have a signed_request. But usually, when surfing, browsers use GET requests. So you can assume, if you receive a POST request, it is either from your own form or a hacking attempt.
In both cases, you check the values of that request for validity.
If they are valid, you save them to your DB and redirect to a "success" page. E.g. if you are up for a contest, you should show a page that assures the user he/she has successfully participated.
If the data is not valid, you save your error messages into the session and redirect back to the form where you show them.
I always suggest you redirect after a POST request, no matter if you are in a facebook tab or not. But in a facebook tab, the redirect must be done using a javascript since it is within an IFRAME and you want the whole page to reload:
<script type="text/javascript">
parent.location.href = 'http://www.facebook.com/pages/xXx/[page_id]?sk=app_[app_id]&app_data=form';
</script>
Post scriptum 1: For me, forms always use POST requests.
Post scriptum 2: If you don't like the idea of the whole facebook "frame" to be reloaded every click, you can think of doing some AJAX magic where the requests are "spiced" with extra data for you to recognize them as "yours".
Im trying to put the facebook permissions dialog within an iframe, however not making much progress because of lack of Facebook documentation, and the undocumented hacks around web are not working any more.
news.yahoo.com does something that i would like to emulate.
When you click on a news article it says login with facebook. After the initial oauth dialog to authenticate the user ( which does not ask for permissions), yahoo pop's another dialog from a yahoo URL which included the Permissions dialog within as an IFrame.
Does anybody know what API's can be used to accomplish this?
The fiddler trace indicates that the yahoo URL is calling:
the uiserver.php endpoint with the permissions.request method.
https://www.facebook.com/connect/uiserver.php?method=permissions.request&app_id=194699337231859&display=iframe&redirect_uri=https%3A%2F%2Fopen.login.yahoo.com%2Fopenid%2Fyrp%2Fsc_check&cancel_url=https%3A%2F%2Fopen.login.yahoo.com%2Fopenid%2Fyrp%2Fsc_check&perms=user_birthday%2Cuser_likes%2Cemail%2Cpublish_actions&response_type=code&locale=en_US
When i try to do this using FB's javascript SDK:
FB.ui({
method: 'permissions_request',
perms: 'read_stream,publish_stream,user_photos',
display: 'iframe'
},
function(response){
alert("badfood");
alert(response);
});
It goes to a different endpoint: facebook.com/dialog/permissions_request? ...
And I get a 500 server error from facebook without useful debug info.
Thanks
some things.
1) first add the parameter show_error=true. This will tell you more about what's really causing the error.
2) Facebook has multiple ways it can display any dialog. In the fiddler request, note the display=iframe parameter. This is used for canvas applications mainly but can be useful for regular iFrame displays as well. It opens the auth dialog in a lightbox.
3) Try loading the SDK synchronously. Remove the Async references that Facebook tells you to include at the top of the page after the body tag and use the secondary method. Include the all.js and fb-root div tag and load FB.init just before your FB.ui call.
4) Check out the echo tool.
This tool can print out your GET params or your . It can also decode
the signed_request parameter as used in Canvas applications with the
OAuth 2.0 Beta migration enabled. This is very useful in debugging
Canvas Authentication.
http://developers.facebook.com/docs/reference/dialogs/
Loading the auth/permissions dialogs inside iframes are not permitted nor possible due to the risk of clickjacking. Sites where you see this being done have special agreements with Facebook that allows them to do this.
I got a page at www.somedomain.com/facebook/index.html http://www.somedomain.com/facebook/index.html. I'd like to serve that via the apps...so via the canvas but when I point the canvas url to this directory (www.somedomain.com/facebook/) I get a page not found error on the apps page. However, hitting www.somedomain.com/facebook/ http://www.somedomain.com/facebook/ does serve index.html in a browser. Any clues as to what's going on here? Might add...there is no https page setup as yet. This is just a static HTML page that I'd like to serve via apps.
Thanks!
In order to load your page inside the canvas iframe, Facebook is issuing an HTTP POST request for the URL http://www.somedomain.com/facebook/index.html.
My guess is your server only serves pages requested using GET.
I can't seem to get the Facebook Graph API to work in IE7, IE8, and Opera while it is working fine in FF3.6, FF8, IE9, and Chrome.
I am following the Client-side Flow from the Facebook authentication docs.
I have a Facebook Connect link and when the user clicks on it the page is directed to:
https://www.facebook.com/dialog/client_id=YOUR_APP_ID&redirect_uri=YOUR_URL&response_type=token
The user logs in and authorizes the app if needed.
The redirect_uri page gets the access_token back just fine. I then try to do an ajax get for https://graph.facebook.com/me to just return the public data (I need name and id).
The request does not succeed.
Doing some research and finding this stackoverflow post I tried changing the ajax response type to 'text/javascript' (also tried several others). Same issues occurs.
Removing ajax from the equation I try to hit the API directly with the browser (not logged into Facebook and without an access_token) like this example from Facebook Graph API Reference page.
https://graph.facebook.com/btaylor
I can view it fine in FF. I can download and then view it fine with IE9. I get this error in IE8:
Unable to download btaylor/ from graph.facebook.com.
Unable to open this Internet site. The requested site is either unavailable or cannot be found. Please try again later.
While searching for answers I found this stackoverflow post, and sure enough Facebook's Graph API Explorer does not work in IE8.
I can't find much else on this topic which seems to say I am doing something horribly wrong. Or have developers given up on IE < 9?
A straight up GET request doesn't work in IE 8 because IE 8 can't understand the JSON format that the data is coming back in and so it crashes. For the AJAX response, you should set the AJAX reponse to application/json, not text/javascript. Is there a reason you can't just use the Facebook JS SDK? For example:
FB.init({ // options });
FB.api('/me', function(response)
{
// do stuff
});
I'm not actually sure why the Graph API explorer isn't working in IE 8, but for me, the explorer throws Javascript errors but doesn't crash the browser, while loading a Graph response via a GET results in a browser crash.
I think this is most likely just a typo on your part for the question, but the correct Facebook authorization URL is:
https://www.facebook.com/dialog/oauth?client_id=YOUR_APP_ID&redirect_uri=YOUR_URL&response_type=token
Other than that, I really can't see anything else that you are doing wrong. Looks like IE8 is on its way out.