I'm converting my facebook app to run through HTTPS.
It seems like when I set the FB._https variable to true, the FB.Canvas.setAutoResize()
stops resizing the iframe.
This is what my code looks like:
window.fbAsyncInit = function() {
FB._https = true; // troublemaker
FB.init({
appId: facebookAppId,
status: true,
cookie: true,
session: facebookSession,
xfbml:开发者_开发知识库 true
});
// The parameter show how many milliseconds to wait between
// resizing.
// Apparently, 91 is Paul's favorite number.
// http://developers.facebook.com/docs/reference/javascript/FB.Canvas.setAutoResize/
FB.Canvas.setAutoResize(91);
};
Any ideas?
If you set FB._https = true;
and you access the page over http then you have trouble.
I suggest using FB._https = (window.location.protocol == "https:");
per Facebook JavaScript SDK over HTTPS loading non-secure items
Remove the line specifying FB._https. you should not be setting this value. The JS SDK does this on its own when it is loaded. Setting it yourself is a hack -- the underscore in the name is supposed to suggest that the value is not for external modification.
You should use a cross-domain communication channel URL. Information about this is documented on the JavaScript SDK page. When you use the channel URL, make sure not to specify a protocol like "http:" or "https:". The channel URL should begin with "//", or else it should be manually constructed based on document.location.protocol.
Make sure you have properly set a "Site URL" and "Site Domain" in the application's settings. This is crucial for various JS SDK functions.
I'm having the same issue. It seems like it depends on where I put the connect script. Here's the code for getting SSL to work. You have to remove the connect script and go with the channelUrl.
<!-- COMMENT OUT <script src="https://connect.facebook.net/en_US/all.js"></script>-->
<script type="text/javascript" charset="utf-8">
FB._https = (window.location.protocol == "https:");
window.fbAsyncInit = function() {
FB.init({
appId : 'xxxxxxxxxxxxx', // App ID
channelUrl : '<?php echo bloginfo('url');?>/channel.html', // Channel File
status : true, // check login status
cookie : true, // enable cookies to allow the server to access the session
oauth : true, // enable OAuth 2.0
xfbml : true // parse XFBML
});
FB.Canvas.setAutoGrow();
}
// 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));
//FB.Canvas.setAutoGrow();
/*FB.Event.subscribe('edge.create',
function(response){
top.location.href = '';
}*/
Here's the code to get the ifame to re-size, but breaks ssl. Add connect script back to the top and remove channelUrl. Actually you don't have to remove the channelUrl for it to work.
<script src="https://connect.facebook.net/en_US/all.js"></script>
<script type="text/javascript" charset="utf-8">
FB._https = (window.location.protocol == "https:");
window.fbAsyncInit = function() {
FB.init({
appId : 'xxxxxxxxxxxxxxx', // App ID
//channelUrl : '<?php echo bloginfo('url');?>/channel.html', // Channel File
status : true, // check login status
cookie : true, // enable cookies to allow the server to access the session
oauth : true, // enable OAuth 2.0
xfbml : true // parse XFBML
});
FB.Canvas.setAutoGrow();
}
// 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));
//FB.Canvas.setAutoGrow();
/*FB.Event.subscribe('edge.create',
function(response){
top.location.href = '';
}*/
I don't get it.
Phil
精彩评论