I have a like button on my page that I'm hosting as a FB app. Question is: Leaving the data-href blank on the like, sets my canvas url "www.example.com/page.aspx" for liking. Window.location.href or window.top.location all point to the canvas URL.
I want the users to like the app URL instead of the canvas URL. Anyway I can get this in the code behind? or in javascript? I do not want to specify this, because I want to do this for multiple applications each one to point to their own app url to like.
Usually you have to somehow initialize the app in order to work with it so in your config you should have a canvas name (or namespace).
Another method would be to query the graph-api for convas details. The query should look something like this:
var app_data = FB.api("/you_app_id");
You should test it first with Graph API Explorer . And also remember that this is an expensive call if you're doing it on each page request. You will get an array with all the info about your currently loaded app including the canvas name. Having the canvas name you can form the app URL like this: http://apps.facebook.com/your-canvas-name
Short answer: No!
Longer answer: You cannot get any information from a frame in another domain. This is for security purposes. So if you try:
console.log(window.top.location.href);
...when the frames are in the same domain, you'll get the url. Otherwise, you'll get a security exception.
Related
I have an application running in an iFrame that is embedded in a SharePoint site. The problem with this is navigation within the application does not result in a change in the SharePoint site URL. Therefore, if you were to refresh the overall page, you would be sent back to the default page of the application, not stay on the same page of the application. The reason this is an issue is sharing for social media. I have added a Facebook Share button to the application, but when it pulls the URL of the application which does not match or reference the URL of the overall site, so it just shares the application (which is not visually appealing and does not allow you to access the rest of the site).
Any body have any suggestions or know a place I can go for help? Thanks!
If I understand properly, the Facebook stuff is INSIDE the iframe?
If so, you can:
* Remove the iframe and integrate the application better with SharePoint, or
* Change the application so that it detects that it's running "alone" (with javascript etc), and if so redirect to the "big" application.
IF the Facebook stuff is in SharePoint, OUTSIDE of the iframe, you can write some javascript to update the URL in some way that matches the URL of the application. This requires that the SharePoint parent application and the iframe application run in the same domain - if they are not, this is not an option.
Note that changing the "parent" URL with JS will reload the page, UNLESS you only change the URL after the "#" part (so you can do something like:
"http://sharepoint/iframe.aspx?aa=11&bb=22#iframeUrl=http://uglyapplication/"
You'll also probably want to write JS to update your iframe accordingly if the user press "back"/"forward" etc in the browser, because changing the URL like above will still add a "step" to the browser history.
I think there are a few similar questions that seem to suggest using app_data in the signed request (http://developers.facebook.com/docs/authentication/signed_request/) but I'm not sure if it will be possible to do what I am trying to achieve with it as I've never used it before.
If I have my Facebook 'Tab' Url as follows:
http://www.facebook.com/pages/PAGE_TITLE/PAGE_ID?sk=app_APP_ID
What I want to do is add an extra parameter on the end as follows:
&WT.mc_id=email-uk-8014
The reason for this is for tracking purposes and links will be sent out of the form
http://www.facebook.com/pages/PAGE_TITLE/PAGE_ID?sk=app_APP_ID&WT.mc_id=email-uk-8014
and the extra parameter will allow us to track the campaign id.
As you can see I have no way of knowing the value of the parameter beforehand as it depends on the link clicked by the user so is it possible to somehow get the value of the WT.mc_id parameter inside my iframe app?
app_data is the only parameter passed through other than the page ID and user's basic details (locale and if they do/don't like the page) - you'll need to use that for any sort of campaign tracking (or link elsewhere and redirect to the tab after capturing your analytics data)
you can pass get variables in facebook but only in canvas application
you just have to use $_REQUEST['xxx'] to retrieve the data.
you should not pass the param in href of facebook. Instead just make linking inside your app so that you can track the events. As you will be in iframe and having complete control you can do same on your own site.
I have a facebook page tab iframe and would like to access the browser url in order to get the current facebook page url.
I know it's not possible to use a javascript that interacts with the parent frame because of browser security issues.
An approach that didn't work for all browsers was to read the HTTP_REFERER header from the request.
Is there a better way?
I hope this is impossible at all. Otherwise it will be a security issue, likely to be closed.
You should not write code depending on compromising other users.
It is not possible to get URL of a parent Frame due to cross-domain policy. And there is no way to get the information about page your application running on in client-side.
But on the server-side you can reconstruct the Page URL using details passed in signed_request. For Page Tab Applications it contains page:
A JSON object containing the page id string, the liked boolean (set to true if the user has liked the page, false if not) and the admin boolean (set to true if the user is an admin of the page, false if they're not).
Using that page id you can build the Page URL:
http://www.facebook.com/pages/-/PAGE_ID
If you want the link to your Page Tab with your application use:
http://www.facebook.com/pages/-/PAGE_ID?v=app_APPLICATION_ID
Beware, HTTP_REFERRER is provided by client and cannot be trusted, and it's may be cut by plugin/proxy/etc...
Notes:
Pages may have different URL in real life, but using this technique user will be landing the correct Page since Facebook will issue redirect to correct URL of a Page.
Sample URLs use HTTP scheme, feel free to use HTTPS if you need it.
In PHP for example you can detect the current scheme like this:
$scheme = ((isset($_SERVER['HTTPS']) && $_SERVER['HTTPS']!=="off") ||
(isset($_SERVER['HTTP_X_FORWARDED_PROTO']) &&
$_SERVER['HTTP_X_FORWARDED_PROTO']=="https")
) ? 'https' : 'http';
HTTP_REFERRER might not work as expected in my experience. If the tab app is designed for a specific page (which I suppose it kind of should), have you tried recreating it?
https://www.facebook.com/MYPAGENAME/app_MYAPPID
Where MYPAGENAME is your page name and MYAPPID is the app id, of course.
If the tab is applied to multiple pages though, I'm quite sure you'll get the relevant data to apply the above from https://graph.facebook.com/PAGEID, where PAGEID is the ID of the page which you get from the signed request.
I'm coding a "one page" app inside facebook (using the canvas app approach). While the user moves inside the app I'm changing the location like: apps.facebook.com/my-app#current_location and loading stuff via AJAX.
Unfortunetely, when someone loads http://apps.facebook.com/my-app#current_location in their browser, the canvas app doesn't see the url fragment #currrent_page.
How can I get around this limitation?
Although I cannot answer properly your question, (and as I think it's kind of old already) the info below should help other people understand better these # (hash) things. They are called URL Fragments.
http://blog.httpwatch.com/2011/03/01/6-things-you-should-know-about-fragment-urls/
Any URL that contains a # character is a fragment URL. The portion of
the URL to the left of the # identifies a resource that can be
downloaded by a browser and the portion on the right, known as the
fragment identifier, specifies a location within the resource:
Fragments Are not Sent in HTTP Request Messages
If you try using fragment URLs in an HTTP sniffer like HttpWatch,
you’ll never see the fragment IDs in the requested URL or Referer
header. The reason is that the fragment identifier is only used by the
browser – it doesn’t affect which resource is returned from the
server.Here’s a screen shot of HttpWatch showing the traffic generated
by refreshing a fragment URL:
The URL fragment is only read on the client-side (users' browsers), so Facebook won't and can't sent that on the POST request it makes to your server.
What you can do is catch all URLs with the same route, regardless of the server-side language of your choice, encode them somehow, and send them to the client to be read by client-side Javascript which would then be responsible for navigating.
Example: the user loads http://apps.facebook.com/my-app/current_location (notice the / instead of the #). You serve your single page, where you'll have something like (ERB):
<script>MyApp.navigate("<%= request.path %>");</script>
Your navigate function could do the following:
function navigate(path) {
window.location.href = "#" + path;
}
Yeah, the Hash urls are nice to use for navigation within your site, however, not so good when sharing the url. The solution is to create canonical URLs for each of your objects.
So, when someone can access specific information like http://yoursite.com/#artists/styx, you also have a way for your server to serve content from http://yoursite.com/artists/styx. This way someone can share http://apps.facebook.com/yoursiteapp/artists/styx and then get to the correct content within your site.
I am not sure, I am using a pretty standard piece of code for facebook. It sends requests for people regarding my application. All of a sudden I am receiving this error:
serverfbml form action must be within
the application's connect url
Have you been having problems with using either one of these:
fb:serverFbml
fb:request-form
fb:req-choice
fb:multi-friend-selector
thank you!
I don't know if you managed to find a solution yet, but I will tell you what my solution is. The action attribute of your forms should NOT be relative URLs, that is you should give the full URL of the website where the application is hosted:
fb:editor action="http://www.mydomain.com/myapp/index.php?params=1" labelwidth="100"
Use the canvas URL under Facebook Integration section in your application's edit mode.
If your canvas URL looks like this:
http://www.example.com/myfacebookapp/
then, in server fbml form action, the URL MUST be in the same directory of your canvas, like this:
(using the example of
<fb:request-form action="http://www.example.com/myfacebookapp/somepage.html"
Also, if the whole contains blank spaces i.e.
http://www.example.com/myfacebookapp new/
consider eliminate that blanks, or use %20 instead of the blank when you specify the URL canvas on Facebook and when you use that URL in form
<fb:request-form action="http://www.example.com/myfacebookapp%20new/somepage.html"
I solved it finally.
Dont get messed up with all type of setting.
Simply go to your facebook app
click edit app button
now copy Canvas URL
and paste it under
<fb:request-form action="CANVAS URL HERE"
method="POST">
Well, it worked for me.!
Thanks to "tsegaye"
i had the same issue.. i used the canvas url in the summary page and it worked. You can try it out aswell
This is not the solution. If you do this, when user clicks "skip" on the dialog, he would be send to http://www.mydomain.com/myapp/index.php?params=1" instead of your application.
The solution is:
action="http://apps.facebook.com/myapp/" -> this "/" at the end would help.
It could be also any other action inside your app for example:
action="http://apps.facebook.com/myapp/sendRequest"
This solution works if you use friend selectors outside the scope of sending requests. For eg. Selecting friends to collaborate with in your app.
Not an answer but this is what helped me. I have a iframe based application and i tried to use the facebook iframe based friend invite code. In my action, i put the app.facebook.com/myapp/ url which whould be give me this fbml error
serverfbml form action must be within the application's connect url
Also when i pressed "skip" it would take me to a 404 error. The solution was to use the canvas url under facebook integration, as suggested by #tsegaye