[Facebook] FBJSでFacebookアプリ内でJavaScriptを利用 Kawa.netブログ（川崎有亮）/ウェブリブログ

[Facebook] FBJSでFacebookアプリ内でJavaScriptを利用

<< 作成日時： 2007/08/20 16:36 >>

Facebook では、FBML という HTML サブセットの独自言語で
サードパーティの開発者が誰でもアプリケーションを作成できる。
FBML では当初は <script> 要素は利用できなかったが、
現在は暫定仕様ながら FBJS として、JavaScript が利用可能になった。

facebook.com ドメイン内のページ上でフル機能の JavaScript が
利用できてしまうと、セキュリティの問題があるため、
FBJS では安全対策が施された機能制限版の JavaScript となっている。

＃こういう仕組みは、どこか穴が出来て
＃セキュリティホールが見つかるパターンも多いけど
＃今のところ見ている限りでは問題なさそう。。。

変数名・関数名のプリフィックス

まず FBJS では、スクリプト中の全ての変数・function 名に
各アプリケーションごとのプリフィックスが付けられる。
このため window、document などのグローバル変数は取得できない。
また、eval、alert などの JS 標準関数も利用できない。

FBJS で書いたアプリケーション例：

var foo = 'Hello';
function bar ( obj ) {
alert( foo );
}

実際にブラウザに渡されるコード：

var a235394XXXX_foo = 'Hello';
function a235394XXXX_bar ( a235394XXXX_obj ) {
a235394XXXX_alert( a235394XXXX_foo ); // error!
}

上の例では、a235394XXXX_alert() 関数が未定義なので、エラーとなる。

DOM 操作

FBJS でも DOM エレメントの生成～ページへの描画は可能。
ただし、エレメントのプロパティを直接操作できず、
FBJS 独自のアクセサを利用して制御する。

var image = document.createElement( 'img' );
image.setSrc( 'http://www.kawa.net/xp/images/xp-title-256.gif' );
image.setStyle( { border: '2px solid black' } );
obj.appendChild( image );

詳しくはFBJS DOM objects を参照。

document オブジェクト

document.createTextNode は利用できない。
document オブジェクトで利用できるのは、
getElementById、createElement、setLocation の３メソッドみ。
getElementById は FBML アプリケーション内の要素のみ検索可能。
createElement は許可された要素のみ作成可能。

document.getElementById = function (id) {
    var appid = fbjs_private.get(this).appid;
    return fbjs_dom.get_instance(document.getElementById("app" + appid + "_" + id), appid);
};
document.createElement = function (element) {
    var mix = fbjs_sandbox.safe_string(element.toLowerCase());
    if (fbjs_main.allowed_elements[mix]) {
        return fbjs_dom.get_instance(document.createElement(mix), fbjs_private.get(this).appid);
    } else {
        switch (mix) {
            case "fb:swf":
                return new fbjs_fbml_dom("fb:swf", fbjs_private.get(this).appid);
                break;
            default: fbjs_console.error(mix + " is not an allowed DOM element");
                break;
        }
    }
};
document.setLocation = function (url) {
    url = fbjs_sandbox.safe_string(url);
    if (fbjs_dom.href_regex.test(url)) {
        document.location.href = url;
    } else {
        fbjs_console.error(url + " is not a valid location");
    }
    return this;
}

FBJS 面白そう。
　

<< 前記事（2007/08/19）

トップへ

後記事（2007/09/12）>>

月別リンク

トラックバック（0件）

タイトル（本文）	ブログ名／日時

コメント（0件）

内容	ニックネーム／日時

<< 前記事（2007/08/19）

トップへ

後記事（2007/09/12）>>

Kawa.netブログ（川崎有亮）