I have an iframe application which works fine but the issue comes when the content of iframe is large the text appears to be cut down.
I registered the application as iframe and set as resizable.
I have applied the following code but nothing seems to work
<div id="FB_HiddenIFrameContainer" style="display:none; position:absolute; left:-100px; top:-100px; width:0px; height: 0px;"></div>
<script src="http://static.ak.facebook.com/js/api_lib/v0.4/FeatureLoader.js.php" type="text/javascript"></script>
<script type="text/javascript">
FB_RequireFeatures(["CanvasUtil"], function(){
FB.XdComm.Server.init(xd_receiver.htm);
FB.CanvasClient.setSizeToContent();
});
</script>
I have xd_receiver.htm file in myapp folder.
Please help me on this
In my iframe app I use
FB.CanvasClient.startTimerToSizeToContent();
instead of setSizeToContent() which seems to work for me.
Edit:
Can your javascript actually see the xd_receiver.htm file? Does it need a path (absolute or relative?) Is Apache serving static files from that directory?
What browsers have you observed the problem in? Try running in firefox with firebug installed to debug javasript problems. I'm not sure if the code you posted is actually what you're using, but it seems to be missing quotes on the "xd_receiver.htm" and also, no api key.
Regarding the xd_receiver.htm--> If the path to your callback url is callback, it should exist at callback/xd_receiver.htm. You have specified a relative path, so if your canvas page lives at /foo/page.htm, then the receiver page should exist at /foo/xd_receiver.htm. You could also specify at absolute path like '/xd_receiver.htm' and just keep your xd_receiver at the root.
Your page should look something like this:
http://gist.github.com/156633
Related
What should contain a HTML file to display it on a Facebook Page's Tab. I have added the tab, but I get blank page, I have tried everything, searched hours, my URL is HTTPS, so I really don't know...
Could you paste anybody a full HTML code that works, appears in a Page's Tab with an app? Thanks!
That would be the minimum, it definitely works:
<!DOCTYPE html>
<html>
<head>
</head>
<body>
hello there
</body>
</html>
As you can see, nothing fancy there. Without any test URL, we can only tell you to open the browser console and search for errors.
We found the answer, the server doesn't enable the iframing, so what I tried was good, but
Console's JavaScript error: Load denied by X-Frame-Options: https://www.... does not permit cross-origin framing.
So we contacted to our hosting company to solve this.
UPDATE: Hosting support added the following code to my .htaccess file: Header always unset X-Frame-Options, what solved my problem.
My client has an old website on freeserve.co.uk (dodgy and free, now belongs to Orange but no support). I want to redirect all pages on the old site to newdomain/index.php. The index page on the old site is index.htm, however most other pages are .html.
Whatever I try the 301 redirect doesn't seem to work. Has anyone come across freeserve before?
You want to redirect the user when they load the page, here are some examples.
Here's the main example
<head>
<script type="text/javascript">
<!--
window.location="http://www.newlocation.com";
//-->
</script>
</head>
but there are a few other options depending what behaviour you're after.
I've been working on a problem for the last day and a half now and have still yet to find a solution.
When visitng my game on facebook (which is in facebook's iFrame) php sessions don't work. This is for IE and Safari. Chrome works fine.
I've already read all the posts on stack about this problem, which seems to be down to third party cookie security and needing interaction with the iFrame first. There was a workaround by making javascript post some form data to the iFrame first, but this seems to have been 'fixed' in the latest versions of the browsers very recently as this no longer works.
I even tried implementing a start page that would require them to click a link first (in the iFrame) to load another page which would then create the session. But even THAT doesn't work.
I'm also having trouble even loading new pages in the iFrame using javascript, which seems to always cause infinite loop refreshes.
And no, P3P headers do NOT solve it.
Does anyone have a solution to this problem? I can't be the only one with it, considering how many facebook apps exist!
I came across this problem using a client that had "Accept third party cookies" disabled. My solution was to force PHP to embed the session ID into the URI by putting this line at the start of each page:
ini_set('session.use_trans_sid', true);
As the URLs are in iframe within Facebook the SID is not seen in the top window.
For IE, you will need the P3P Headers set. Something like:
<?php header('P3P: CP="CAO PSA OUR"'); ?>
Safari blocks 3rd-party cookies by default. Currently, the only work-around that is working for me is to "pop-up" a new window to set the cookies. I have something like this:
<script type="text/javascript">
function safariFix(){
if (navigator.userAgent.indexOf('Safari') != -1 && navigator.userAgent.indexOf('Chrome') == -1){
window.open('https://yourdomainname.com/safari.php', 'Safari Fix','width=100,height=100');
}
}
</script>
And safari.php will have this:
<?php
setcookie("safari_test", "1");
?>
<!DOCTYPE html>
<html lang="en">
<head>
<title>Safari Fix</title>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js"></script>
</head>
<script type="text/javascript">
$(document).ready(function(){
window.close();
});
</script>
<body>
Since Safari does not accept third-party cookies by default, we are forced to open this window.
This window will automatically close once we have set the cookies.
</body>
</html>
PROBLEM: This won't work if users have "block pop-ups" enabled in Safari. If anyone has a better solution for this, inform me ;)
I'm running into a bit of trouble trying to call my native iOS application from my web app (apple-mobile-web-app-capable). Whenever I'm in Safari pressing the button to open my app with a custom url scheme, that works just fine.
However, when I've added it to the home screen I get stuck with the error: The URL can't be shown. Redirecting to http or https works fine but if I call mysupercustomurlscheme:// I get the error message above.
I've tried opening it by document.location.href, window.location, etc etc but nothing seems to do the trick and I've run out of ideas.
If anyone has got any ideas I'd be most grateful to hear them.
Thanks in advance!
Okay, here's a somewhat clumsy way to do it, but it works and might help some poor soul out there trying to achieve the same thing.
First, create a simple HTML link as, apparently, regular HTML links open in Mobile Safari instead of within the full screen view in the web app.
Link
In redirect.html you simply redirect the user with some simple javascript.
window.location = "mysupercustomurlscheme://"
And that's it! It's certainly not the best way to do it but it's 'fairly' seamless. That's what I came up with at least, if you have any other suggestions do let me know.
Hope this helps someone!
Just wanted to post an example of what Tobias is referencing. You need to host on your server and link to in emails, social media, etc. Simply substitute in your app's URI and your App Store link. Note that the iframe works on more browsers.
<!DOCTYPE html>
<html>
<body>
<script type="text/javascript">
window.onload = function() {
// Deep link to your app goes here
document.getElementById("l").src = "my_app://";
setTimeout(function() {
// Link to the App Store should go here -- only fires if deep link fails
window.location = "https://itunes.apple.com/us/app/my.app/id123456789?ls=1&mt=8";
}, 500);
};
</script>
<iframe id="l" width="1" height="1" style="visibility:hidden"></iframe>
</body>
</html>
So, if the user has your app installed, the link with the URI will succeed and you will exist the browser before the script for redirecting to the App Store can be triggered. If the user does not have your app, the redirect succeeds (after a brief ugly error message). I am a developer at Branch and we use this, so feel free to reach out with questions in implementing.
The facebook comment plug in is not working with smarty template. The code I am using is given below
<div id="fb-root"></div> {literal}<script src="http://connect.facebook.net/en_US/all.js#appId=APP_ID&xfbml=1"></script>{/literal} <fb:comments width="425"></fb:comments>
Please check this and let me know if there is any solution for this
Thanks In Advance
Rose
The issue is most likely because of the order in which this template loads on the page. You are most likely going to need to manually initialize the XFBML on your page for the tag to render. This is probably beyond what a template engine is going to be able to do. You are going to need to call FB.init(xfbml:true); after the template has loaded on the page. Also, change the script reference to
<script src="http://connect.facebook.net/en_US/all.js"></script>
The initilization call should occur only after the above script is loaded.
<script>
FB.init({xfbml:true});
</script?