I have a site, which works both as a standalone and as embedded into Facebook. Generally it works ok, but I want a content on some of its pages vary depending on is it embedded or not. I mean is it browsed via Facebook right now. How can I do this?
Using a server-side language, you could see if there is a signed_request POST parameter passed to your app on the initial load into the iframe (if so, you’re most likely inside facebook.com with your page), and then save that info into your session, so that you still know where you are once the user starts navigation inside your app in the iframe.
If by 'embedded' you mean functioning as a Canvas App in Facebook, then how about a simple:
if (window.location.indexOf("facebook.com") !== -1){
//Not embedded
} else {
//Embedded in Facebook as a canvas app.
}
Would that do the trick for you?
Related
I have a Facebook app that is giving me fits. I basically have an app that once the user has liked the app, they can continue through the app. Using the Facebook Javascript API, it will see if the user has logged in, and if not allow them to log in. I pass rather or not they "like" the page from the controller, as well as their language (English or Spanish) to the view via the ViewBag object.
This works both locally and from the staging server; however I have to disable the like check in the view, but the language and like is passed in the viewbag.
I placed language in the view like
<p>The user's language is #ViewBag.lang</p>
and
<p>They like the page? #ViewBag.likes
Like I said, both locally and at the staging server it works; but nothing gets passed through to the Facebook app. I have a conditional check to see if the user likes the page in javascript like:
var likes = #ViewBag.likes
In Facebook, using the console I see that the data isn't passed as well as the before mentioned debugging I tried doing.
I am very new to MVC; is there something I need to enable to make it work through Facebook?
Thanks!
Well the issue is that the Facebook canvas sends an initial POST, this was hitting my POST instead of the GET which was setting these values. See here:
Does Facebook open a canvas app with a Post request? It's causing havoc with my MVC actions
Thanks!
Is it possible to get the referring URL to a Facebook page tab?
Right now the referring url is always http://static.ak.facebook.com/platform/page_proxy.php?v=5 and I can't find any documentation about this subject. Is facebook providing this param (I can't find it in the signed_request for example). or is there any workaround? for example would it work if i used a canvas app vs an iframe tab?
for example would it work if i used a canvas app vs an iframe tab?
Nope, the are both loaded in pretty much the same way.
If you have control over the links pointing to your canvas/page tab app, then you can add the "app_data" parameter to those links – that is passed through to your app when Facebook loads it – and then just evaluate that to differentiate between different points of origin.
If it’s about outside links from somewhere on the web – then there’s no way I know of to get an actual referrer, since it’s always Facebook “linking” to your app in the iframe.
Could be that there’s some info in your app’s insights, but I haven’t checked them out from that perspective yet.
I just created a Facebook application that basically creates a new Tab on my Facebook-profile-page and loads contents from my website in an inline frame. Now I got to the point that I added the application to my profile page with a simple link like http://facebook.com/add.php?api_key=APP_ID&pages=1. But how can I prevent others from just doing the same and using my app on their pages then?
Thanks in advance!
Aha! You know the page that it is supposed to belong to, so hard code that in your app's code and you can check the page id coming in from the signed_request and see if that page id is yours. If not, send down not permitted in your response HTML. If it is your page, then response down the good HTML. :)
For more information on signed_request see: https://developers.facebook.com/docs/authentication/signed_request/
I have a mobile web site built using jQuery Mobile. I often run it in full screen/mobile web app mode on my iPhone (I have added the web app to my iPhone home screen).
On one of the pages, the user is required to log in to Facebook using the Facebook Connect JavaScript API. If the user is not already logged in, this is done by clicking a login button. The event handler for this button looks like this:
("#fbLogin").click(function () {
FB.login(handleStatusChange(response),
{ scope: "publish_stream",
connect_display: "touch" });
});
In the above code I have inserted some line breaks for better readability, but the values are like in the example. The callback function (handleStatusChange) takes care of the response from the login request.
When I click this, the Facebook login page is opened in my web app window. If I haven't already accepted the Facebook App, I have to give it permissions as well. All this seems to work fine. But after I have given permissions/logged in I'm left hanging on a totally blank screen.
I have also tried another approach to logging in, by putting this inside the login button event handler:
window.location = "https://www.facebook.com/login.php
?api_key=MY_API_KEY
&cancel_url=http%3A%2F%2Fwww.mywebsiteurl.com%3A8081
&fbconnect=1
&next=http%3A%2F%2Fwww.mywebsiteurl.com%3A8081
&return_session=1
&session_version=3
&v=1.0
&req_perms=publish_stream
&connect_display=touch";
Again, line breaks have been inserted for better readability. When used it's just one long string.
The URL used in the cancel_url and next parameters is the one I have registered with the Facebook Application. If I try using a different URL (like http://www.google.com) I get an error so the this seems to be correct. As you can see I use a different port on my development server (port 8081). Could this be a problem?
The result is similar to the previous example. I get the login/permissions pages but I'm left with a blank screen after everything is done. I tried this after reading this post on the old Facebook Developer forum.
If I, on the other hand, try running this in Safari (not as a full page iPhone web app) the login works great.
Is there anything else I can try? Does anyone have a JavaScript API Facebook Connect login working while running in full screen/web app mode on an iPhone?
Thanks in advance!
Not sure if this helps you, but I found that adding the iOS Safari link fix, also allowed Facebook login to work in my fullscreen web app without opening up the page i "regular" Safari:
// Make links work in iOS fullscreen web app
function disableSafariLinks() {
$("a").click(function (event) {
event.preventDefault();
window.location = $(this).attr("href");
});
}
See also iPhone Safari Web App opens links in new window
Okay, allow me to say first off that I am working on developing my first FB app/page tab at the moment. I'm not looking for anything fancy yet, just workability.
That being said, I have managed to create a FB app that loads from the hosting requested, and displays it under the app page. I have also made it so that I can add it as a page tab to FB pages. What I am having an issue with is that clicking on the page tab for the app, it does not show any content in the iframe on the page, though it shows on the canvas page for the app.
So, my question is, do you have any ideas as to why it might be showing on a canvas iframe and not the page tab iframe? I am currently guessing that it has to do with how the signed request is processed, but am not completely sure. I am using the PHP SDK for FB given here: https://github.com/facebook/php-sdk/ for the FB-related functions, and am tracing through that currently for where I might be going wrong.
Any help is appreciated. Thanks. =)
I had the same problem and was able to solve it by providing different (http vs https) URLs for the secure and non-secure canvas and page tab URLs. Just remove post the non-secure URL for the non-secure canvas/page tab URL fields. I believe this is because Facebook doesn't check to see if the user has secure browsing turned on until after they have logged in.
You could try to change the order of appear of the app tab; it worked for me.