[Facebook] FB.Canvas.setAutoGrow() 가 IE 에서 정상적으로 동작하지 않는 문제

페이스북 앱 개발 후 페이지에 앱을 넣으면 보통은 앱의 길이가 더 길기 때문에
FB.Canvas.setAutoGrow(); 를 사용하여 페이지의 길이를 자동으로 맞춰준다.
(Scrollbar 를 없애기 위해..)

// 2014.06.05
하지만 이상하게도 IE 에서만 해당 기능을 이용했는데도 스크롤이 없어지지 않았다.


예제소스는 다음과 같다.

        var uid;
        var accessToken;
        var name;

        (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/ko_KR/sdk.js";
            fjs.parentNode.insertBefore(js, fjs);
        }(document, 'script', 'facebook-jssdk'));

        window.fbAsyncInit = function() {
            FB.init({
                appId      : '000000000000000',
                xfbml      : true,
                version    : 'v2.0'
            });

            FB.Canvas.setSize({ width: 810, height: 1400 });
            FB.Canvas.setAutoGrow();

            FB.getLoginStatus(function(response) {
                if (response.status === 'connected') {
                    uid = response.authResponse.userID;
                    accessToken = response.authResponse.accessToken;
                } else if (response.status === 'not_authorized') {
                } else {
                }
            });
        };

위의 부분에서 문제가 되었던 부분은 name 이라는 전역변수 때문에 스크롤이 없어지지 않았다.
3~4시간 노가다를 하면서 겨우 찾은 방법.. ㅠ
그리고 facebook sdk 를 동적으로 삽입하는 방법 또한 하단에 있다가 위로 올렸는데
정확하게 다시 테스트 해보지는 못했지만 아래에 있을때 스크롤이 없어지지 않는것 같기도!?
(원래는 상관 없어야 하지만..;;)


결론적으로는 페이스북에서 IE 브라우저에서 특별한 처리를 하지 않았다면 IE의 버그라고 밖에 생각을 할 수가 없는데..
IE9 에서 이런 치명적인 버그가 있단 말인가? (진실은 저너머에..)

페이스북 자체에서 전역변수로 name을 쓴다고 해도 어차피 페이지에 있는 앱은 iframe으로 들어와 있기 때문에 변수명이 겹치지 않는다.

아니면 facebook 에서 iframe 내부에 있는 변수를 건드리는게 있는걸까??



by http://www.socialkorea.co.kr/

하이브네스트의 김현진대표와 소셜코리아가 없었다면 페북 개발에 대해서 관심이 없었을테니..
이렇게라도 광고를..ㅎㅎ

둘다 모두 잘 되기를..ㅋ