How can I resolve the resize of facebook app on IE ?
the FB.Canvas.setSize() is not working.
Thanks!
Since there's very little to go on in your question. No example url, no code example. I can only guess. So here's where to start.
1) Be sure to include the Javascript SDK inside of script tags.
<script>
// Load the SDK Asynchronously
(function(d){
var js, id = 'facebook-jssdk'; if (d.getElementById(id)) {return;}
js = d.createElement('script'); js.id = id; js.async = true;
js.src = "//connect.facebook.net/en_US/all.js";
d.getElementsByTagName('head')[0].appendChild(js);
}(document));
</script>
2) Be sure to include the fb-root div inside of the body
<body>
<div id="fb-root"></div>
...your html here...
</body>
3) Be sure to do the FB.init() and FB.Canvas.setSize() after the javascript SDK has had a chance to load. Meaning do it inside of your window.fbAsyncInit
window.fbAsyncInit = function() {
FB.init({
appId : 'YOUR_APP_ID', // App ID
channelUrl : '//WWW.YOUR_DOMAIN.COM/channel.html', // Channel File
status : true, // check login status
cookie : true, // enable cookies to allow the server to access the session
xfbml : true // parse XFBML
});
};
4) Make sure you have specified your APP ID and also the correct location for a valid ChannelUrl
Related
I'm currently trying to allow user to connect to my site with their Facebook account but I have some issues.
First of all, you have to know that I already added a Like button with this code:
<div id="fb-root"></div>
<script>(function(d, s, id) {
var js, fjs = d.getElementsByTagName(s)[0];
if (d.getElementById(id)) return;
js = d.createElement(s); js.id = id;
js.src = "//connect.facebook.net/fr_FR/all.js#xfbml=1&appId=myappid";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>
<script type="text/javascript">
var urlfb = document.location.href;
$(document).ready(function(){
$('fb\\:like').attr('href', urlfb);
});
</script>
So I saw the post of Facebook on how to add Facebook Login to his website but each time I launch the page where I pasted the FB code, there is this famous error message: FB.init has already been called - this could indicate a problem.
<div id="fb-root"></div>
<script>
window.fbAsyncInit = function() {
FB.init({
appId : 'myappid', // App ID
channelUrl : '', // Channel File
status : true, // check login status
cookie : true, // enable cookies to allow the server to access the session
xfbml : true // parse XFBML
});
What do I have to do to remove this error ? I tried to remove my Like button and no more error but I want to keep this like button, so what do I have to delete to make it works ?
Any ideas ?
Thanks
Adding #xfbml=1&appId=myappid to the end of the SDK URL makes it automatically initialze itself – so just remove that part, change
js.src = "//connect.facebook.net/fr_FR/all.js#xfbml=1&appId=myappid";
into
js.src = "//connect.facebook.net/fr_FR/all.js";
I have implemented a Facebook based login.
The FB.login works perfectly, but the FB.logout doesn't. I have tried with different FB.init, deleting cookies, running the logout page several times in a row, but the only way to log my user out is in facebook itself.
The code I'm using for logout is:
<div id="fb-root"></div>
<script src="http://connect.facebook.net/en_US/all.js"></script>
<script>
FB.init({
appId: '***************',
xfbml: true,
status: true,
cookie: true
});
FB.getLoginStatus();
FB.logout();
</script>
Any ideas?
Thank you
did you tried having some button onclick event is FB.logout();
function logout(){
FB.logout(function(response) {
// user is now logged out
});
}
<button onclick="logout()">LogOut</button>
Try This
Try to do this:
<div id="fb-root"></div>
<script>
window.fbAsyncInit = function() {
FB.init({
appId : 'YOUR_APP_ID', // App ID
channelUrl : '//WWW.YOUR_DOMAIN.COM/channel.html', // Channel File
status : true, // check login status
cookie : true, // enable cookies to allow the server to access the session
xfbml : true // parse XFBML
});
// Additional initialization code here
};
// Load the SDK Asynchronously
(function(d){
var js, id = 'facebook-jssdk', ref = d.getElementsByTagName('script')[0];
if (d.getElementById(id)) {return;}
js = d.createElement('script'); js.id = id; js.async = true;
js.src = "//connect.facebook.net/en_US/all.js";
ref.parentNode.insertBefore(js, ref);
}(document));
</script>
and then call the FB.logout(). FB must be initializad before.
From the documentation:
This code loads the SDK asynchronously so it does not block loading other elements of your page. This is particularly important to ensure fast page loads for users and SEO robots.
The URLs in the above code are protocol relative. This lets the browser to load the SDK over the same protocol (HTTP or HTTPS) as the containing page, which will prevent "Insecure Content" warnings.
The function assigned to window.fbAsyncInit is run as soon as the SDK is loaded. Any code that you want to run after the SDK is loaded should be placed within this function and after the call to FB.init. For example, this is where you would test the logged in status of the user or subscribe to any Facebook events in which your application is interested.
I am trying to use javascript sdk for rendering a XFBML form on our site and i keep getting
Unable to load the registration form for . You may have previously blocked this app on Facebook. Go to your Facebook privacy settings to unblock this app. (Error: Invalid 'client_id'.)
my app is registered and with correct id.
the code looks like is:
<script>
window.fbAsyncInit = function() {
FB.init({
appId : '118446328234891', // App ID
channelUrl : '//www.sakshum.org/channel.html', // Channel File
status : true, // check login status
cookie : true, // enable cookies to allow the server to access the session
xfbml : true // parse XFBML
});
// Additional initialization code here
};
// Load the SDK Asynchronously
(function(d){
var js, id = 'facebook-jssdk', ref = d.getElementsByTagName('script')[0];
if (d.getElementById(id)) {return;}
js = d.createElement('script'); js.id = id; js.async = true;
js.src = "//connect.facebook.net/en_US/all.js";
ref.parentNode.insertBefore(js, ref);
}(document));
</script>
<script src="https://connect.facebook.net/en_US/all.js#appId=118446328234891&xfbml=1"></script>
<fb:registration fields="name,birthday,gender,location,email" redirect-uri="http%3A%2F%2Fwww.sakshum.org%2FFbValidation" width="530">
</fb:registration>
just to add on if i use non xfbml version using just iframe then all works fine.
Looks like the issue was using encoded redirect_uri. changing it to normal url fixed the issue.
The redirect-uri must match with the setting "Site URL" in your Facebook app.
I'm new to facebook API and I have some questions related to facebook authentication.
I have created an application and have edited the domain and url.
Website Domain
giftme.web44.net
Site URL
http://www.giftme.web44.net/
I used the following on my site webpage:
<div id="fb-root"></div>
<script>
window.fbAsyncInit = function() {
FB.init({
appId : '3347207XXXXXXXX', // App ID (I've replaced for security reasons)
channelUrl : 'http://giftme.web44.net/channel.html/', // Channel File
status : true, // check login status
cookie : true, // enable cookies to allow the server to access the session
xfbml : true // parse XFBML
});
// Additional initialization code here
};
// Load the SDK Asynchronously
(function(d){
var js, id = 'facebook-jssdk', ref = d.getElementsByTagName('script')[0];
if (d.getElementById(id)) {return;}
js = d.createElement('script'); js.id = id; js.async = true;
js.src = "//connect.facebook.net/en_US/all.js";
ref.parentNode.insertBefore(js, ref);
}(document));
</script>
And I've created the page 'channel.html' with only this:
<script src="//connect.facebook.net/en_US/all.js"></script>
Finally I used the login button:
<div class="fb-login-button" >Login with Facebook</div>
What i'm I doing wrong?
I keep getting this error:
API Error Code: 191
API Error Description: The specified URL is not owned by the application
Error Message: Invalid redirect_uri: A URL informada não é permitida pela configuração do aplicativo.
http://www.giftme.web44.net/ is not equal to http://giftme.web44.net/
The redirect_url must contain the Site URL or Canvas URL as defined in your App Properties.
An example would be:
https://api.facebook.com/method/admin.setAppProperties?
access_token=CURRENTTOKEN&
properties={'post_authorize_redirect_url':'http://giftme.web44.net/channel.html/'}
Error code 191
FB App Properties
I'm using the Like Box code from Facebook and I noticed it hinders my page load. After looking in Firebug it loads a bunch of Javascript and CSS files. I'm wondering is there a way to cache the Facebook Like box? I did search Google but the only one I saw was for Wordpress. I'm using php.
I used #Martin link to find this link https://developers.facebook.com/docs/reference/javascript/
The following code was modified to fit my situation, but I am not sure how much quicker it is or if the cache is working properly.
<div id="fb-root"></div>
<script>
window.fbAsyncInit = function() {
FB.init({
channelUrl : '//WWW.YOUR_DOMAIN.COM/channel.php', // Channel File
status : true, // check login status
cookie : true, // enable cookies to allow the server to access the session
xfbml : true // parse XFBML
});
// Additional initialization code here
};
// Load the SDK Asynchronously
(function(d){
var js, id = 'facebook-jssdk', ref = d.getElementsByTagName('script')[0];
if (d.getElementById(id)) {return;}
js = d.createElement('script'); js.id = id; js.async = true;
js.src = "//connect.facebook.net/en_US/all.js";
ref.parentNode.insertBefore(js, ref);
}(document));
</script>
My channel.php looks like this, also from the same page:
<?php
$cache_expire = 60*60*24*365;
header("Pragma: public");
header("Cache-Control: max-age=".$cache_expire);
header('Expires: ' . gmdate('D, d M Y H:i:s', time()+$cache_expire) . ' GMT');
?>
<script src="//connect.facebook.net/en_US/all.js"></script>
Hope that helps add to the solution.
There's a way to do this: Use channel file and cache it as much as possible. Read more about it here