javascriptでfacebook APIを使用するときに便利なスクリプト「fb_loader.js」

  • このエントリーをはてなブックマークに追加
  • このエントリーをはてなブックマークに追加

images
facebookのAPIをJavaScript SDKで使用する場合、いちいち
<div id=”fb-root”></div>
を記述するのも面倒で、場合によってはできない場合もあるかと思います。
そこでJavaScript SDKを読み込みやすくするためのスクリプトを
つくってみましたので、よろしければお使い下さい。

→Javacsript SDKについての詳しい仕様マニュアル(英文)

仕様説明

内部構造はいたって単純で、Javascriptから<div id=”fb-root”></div>を
追加し、Javascript SDKを読み込むようにしております。

また、SDK読み込み後の処理を複数のファイルに記述できないネックが
あったので、そちらも拡張いたしました。

使い方

下記ダウンロードより、fb_loader.jsを任意のサーバーにアップし、読み込みます。
jQueryを使用しておりますので、jQueryも読み込んでください。

<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript" src="fb_loader.js"></script>

呼び出しの宣言をいたします。

<script type="text/javascript">// <!&#91;CDATA&#91;
// fb_loaderの呼び出し・引数はFB.initで使用するものをそのまま入れる
  FB_LOAD.init({
      appId      : 'YOUR_APP_ID',
      channelUrl : '//www.sample.com/channel.html',
      status     : true,
      cookie     : true,
      xfbml      : true
  });
// FB読み込み完了後に呼び出したい関数を追加
FB_LOAD.ready(function(){
   // 処理1
   alert("サンプル1");
});
// いくつでも関数を追加することができます
FB_LOAD.ready(function(){
   // 処理2
   alert("サンプル2");
});
// &#93;&#93;></script>

ダウンロード

facebook JavascriptSDKライブラリ「fb_loader.js」

バグなどありましたら、ご使用のブラウザ・環境・現象を教えてください。

できる限り修正いたします。

今後も便利な関数などありましたらご紹介していきます。
よろしければいいねして下さいね(^^)

You may also like...

コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です