I am trying to load the following html inside a UIWebView.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<body>
<div id="fb-root"></div>
<script>
window.fbAsyncInit = function() {
FB.init({
appId : 'myAppId',
status : true,
xfbml : true
});
FB.Event.subscribe("xfbml.render", function(response) {
FB.Canvas.setSize();
});
};
(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 = "http://connect.facebook.net/en_US/all.js";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));
</script>
<div class="fb-comments" data-href="http://www.google.com/" data-num-posts="10"></div>
</body>
</html>
In a browser it displays the comments box correctly and FB.Canvas.setSize() resizing the height appropriately (without it the iframe's span height is set to 160).
This setSize() function appears to do nothing inside of a UIWebView, probably because the scheme of the url is not http or https. I cannot verify this because the Safari debugger doesn't show me the 'Unsafe Javascript attempt' message.
I am loading the UIWebView with loadHTMLString:baseURL:
How can I get the facebook comments box to have the appropriate height?
Side notes:
Similar question: Unable to load full Facebook comment plugins inside an iOS UIWebView
Mucking around in facebook's all.js I found this code inside the comments function (if you're looking look for 'sdk.XFBML.Comments') that sets the height
getSize: function() {
if (this._attr.mobile) return {
width: '100%',
height: 160
};
return {
width: this._attr.width,
height: 160
};