Changing Facebook URL from inside the canvas app - facebook

I am building a one page Facebook Canvas App using the JS SDK.
Navigation inside the app does not require a new full HTTP request, so I wonder how can I change the "main" facebook URL (http://apps.facebook.com/my_app/[URL]).
All I've been able to do to change the browser URL is call
parent.location.href = 'http://apps.facebook.com/my_app/[SOME_URL]'
but this of course reloads the entire page, and it's not exactly what I want to do. I see lots of unanswered questions about this, is there a JS SDK trick or something like that, since all history/location access from inside the app frame is prohibited for security, or it's just something we'll never be able to do?

Related

Can't access ViewBag data in Facebook App

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!

Facebook canvas app with rails3

I'm writing facebook canvas application with Rails3 using omniauth-facebook gem. The few moments are not clear:
Rdirect after sing in (in '/auth/facebook/callback' => 'session#create'):
After successful sing_in if user is redirected to root_url it sometime arrives to
my canvas page URL (http://localhost:3000) outside of the frame. On other hand, when
redirecting him to my app url (http://apps.facebook.com/my_app) it sometime stacks on
blank page inside the frame. So how to handle this redirect correctly?
What is a proper way to link between pages inside my app? Currently I use relative links and top.location url is always stay my app url (http://apps.facebook.com/my_app). But I saw that many facebook apps redirect the client top.location (http://apps.facebook.com/my_app/internal_link)... It raises one more question:
Now facebook always fetch my app into the iframe using POST method. How to handle this behavior in RESTful rails application?
I'd very thankful for any advices...

How to like / share URLs inside Facebook that contain get-parameters

We are working on a facebook-app with lots of dynamic pages. As the app is embedded in a tab on a facebook page, the urls contain a get-parameter to address the correct tab/app. We want to implement like- and send-buttons for several pages within our app, but facebook seems to dump all get-parameters from urls within facebook. As the result all like- and send-buttons point to the facebook-page itself instead of the tab.
Does anybody now any workaround? We already tried redirects via an external sefor facebook urls only.rver but facebook seems to evaluate the links on click of the like-/send-button (and seems to follow all sort of redirects).
UPDATE:
Here is an example of a problematic url:
https://www.facebook.com/smartmobil.de?sk=app_171502639574871
UPDATE:
The problem seems to be independant of url get-parameters. It seems that the like-button does not work with any url starting with www.facebook.com
When used in a like-button everything behind the ? will be dumped. This seems to happen for facebook urls only.
Best workaround so far is to point your like buttons at external (non-facebook canvas) urls.
To make this work, you need to do some conditional redirecting to get the user back into your canvas URL. You can either use a client side javascript redirect:
<script>
window.location = 'http://apps.facebook.com/yourcanvasname/foo/bar';
</script>
Or you can do a server side redirect based on the useragent string. Basically, if the useragent contains 'facebookexternalhit' then render a basic HTML page containing OG tags, if not, redirect to the canvas URL.
Doing this means the Facebook sharescraper/linter won't follow any redirects back to the canvas URL, but any user that arrives at your URL will get back to Canvas.
i'm too searching for a solution to control the custom page tab's content through a get parameter (app_data). I still don't have a solution but here at least the reason why all www.facebook.com links are srtiped out of get params. Here at bottom the developer explains why.
Unfortunately I don't think what you are trying to do is possible. Posting a like programmatically requires you to specify a Facebook content ID or alias. This won't work for you because tabs to not seem to have an exposed content ID of their own, and instead use the Page's content ID with an additional parameter which you can't use with the graph.
Liking external links and other content that does not have an ID programmatically is prohibited. With an external URL, the first like of an unrecognised URL creates a new Facebook page for those likes to be represented on (which is the issue I've given up trying to fight), but presumably the presence of your Page's content ID alias (www.facebook.com/smartmobil.de) in the url is making Facebook choose you page rather than creating a new one.
The only suggestion I can think of this late at night is to target an external URL that performs a redirect via Javascript, rather than on the server, but Facebook may be wise to that too and I'm afraid I'm going to bed rather than testing it :)

Direct links to pages in Facebook iFrame application?

Is it possible to link directly to inner pages in a Facebook iFrame app?
For example, say my app lives at http://www.example.com/app. Can I have a link like http://apps.facebook.com/my_app/?id=256 which will navigate to somewhere like http://www.example.com/app/id/256 in my app that lives in the Facebook canvas?
I did a quick search around but didn't find anything, so if there's something already out there, please point me to it!
If your callback URL is set to http://fb.domain.com/ and your canvas URL to http://apps.facebook.com/domain_app/, navigating to http://apps.facebook.com/domain_app/hello will load http://fb.domain.com/hello. This holds true for querystring parameters as well.

Can I embed my own page in a facebook app?

I want to embed a store locator in Facebook the way footlocker does.
Is it possible to just make a facebook app that serves my stand-alone store-locator page without having to re-write my store-locator page for facebook?
Any good guides/how-tos for serving a stand-alone page through a facebook app like this?
This is very common and easy to do. All you have to do is create a facebook application and point your "canvas url" to your store locator page. So for example, if your store locator is www.example.com/storelocator set your Facebook application's canvas url to that page. If you look at that footlocker app you can see that the url of the iframe is actually http://unlocked.footlocker.com/main_store_locator/
If I understand you correctly, you are looking for the canvas guide. According to the documentation you can show your page in an iframe inside a tab on your facebook page.
Unfortunately, no. When you add a FBML/iframe app to your Facebook page, Facebook loads the content, caches it, and injects it into the DOM; it does not actually load it in an iframe. As such, there are restrictions about which elements can be included (eg, only <body> content), how Javascript is used (external libraries require some tweaking), and any element that references an external source (eg, Flash loading content) must have the target domain whitelisted for your application. In short: it's a pain, but it can be done.