LoginSignup
2
3

More than 5 years have passed since last update.

Cocos2d-x(JS) + SDKBOXで簡単Facebook連携

Last updated at Posted at 2016-01-12

はじめに

Cocos2d-x用にSDKBOXというライブラリが提供されています。
SDKBOXを使うことで、Cocos2d-xを使ううえで、ネイティブ連携で苦労していた
課金まわりや、広告、分析(Analytics)といった機能を簡単に構築することができるようになりました。
http://www.cocos2d-x.org/sdkbox

JSでも使える? Web版では?

今回試したかったのはJSとの連携。C++のdocumentが多いようなのですが、
"cocos2d-x that you are using, C++ or Javascript or Lua, SDKBOX will... "
とあるので、JavaScriptでも問題なく使えます。
ただし、Web版に書き出した場合には使用できません。(iOSやAndroidアプリとして書き出した場合に使用できる)

version

Cocos2d-x の2系、3系ともに使えるようですが、今回使用したのは、3.6を利用しました。

ログイン〜シェアまでの流れ

1)新しいアプリを作成する(今回はjsで作ります)

cocos new sdkbox_demo -p com.your_company.mygame -l js -d /Users/user_name/workspace
cd sdkbox_demo/

2) SDKBOXをインストールする

python -c "import urllib; s = urllib.urlopen('https://raw.githubusercontent.com/sdkbox-doc/en/master/install/install.py').read(); exec s"

3)facebook-apiをインストール

cd (自分のワークスペース)
sdkbox import facebook

4)facebookにログインした状態で、下記にアクセスする

5)add Platformで iOS を追加し、バンドルIDを入力する

(ストアIDは空欄で大丈夫そう)
スクリーンショット 2016-01-12 13.56.48.png

(BundleIDの確認/変更はXCodeから..)
スクリーンショット 2016-01-12 14.12.47.png

6) app.jsでsdkboxを読み込み、設定する

    sdkbox.PluginFacebook.init();
    sdkbox.PluginFacebook.setListener({
        onLogin: function(isLogin, msg) {
          if(isLogin){
            cc.log("login successful");
          }
          else {
            cc.log("login failed");
          }
        },
        onAPI: function(tag, data) {
        },
        onSharedSuccess: function(data) {
        },
        onSharedFailed: function(data) {
        },
        onSharedCancel: function() {
        },
        onPermission: function(isLogin, msg) {
          if(isLogin) {
            cc.log("request permission successful");
          }
          else {
            cc.log("request permission failed");
          }
        }
    });

7 buttonを押下した時にloginやshareが発動するようにする

var loginItem = new cc.MenuItemImage(
    res.CloseNormal_png,
    res.CloseSelected_png,
    function () {
        sdkbox.PluginFacebook.login();
...

var shareItem = new cc.MenuItemImage(
    res.CloseNormal_png,
    res.CloseSelected_png,
    function () {
        var info = new Object();
        info.type  = "link";
        info.link  = "http://www.cocos2d-x.org";
        info.title = "cocos2d-x";
        info.text  = "Best Game Engine";
        info.image = "http://cocos2d-x.org/images/logo.png";
        sdkbox.PluginFacebook.dialog(info);
...

8.info.plistにAppIDを入力する

(AppIDはFacebookのappページに記載されている)
vim /frameworks/runtime-src/proj.ios_mac/ios/Info.plist

<string>1.0</string>....

<key>FacebookAppID</key>
<string>150000000000000</string>
<key>FacebookDisplayName</key>
<string>test</string>
<key>LSApplicationQueriesSchemes</key>

...<key>LSRequiresIPhoneOS</key>
<true/>

9 .xcodeproj をXCodeで開き、シュミレーターで実行する

/hoge/frameworks/runtime-src/proj.ios_mac/hoge.xcodeproj

10 シェアする

シュミレーターからシェアしてみると..
スクリーンショット 2016-01-12 14.09.53.png

このようにShareされました。
screen.png

最後に

IAPやADなども同じように簡単に実装できるらしいです。
これまでネイティブ連携はなかなか大変だったので、このように楽に実装できるようになると使い方広がりそうです。

参考

インストール
http://docs.sdkbox.com/en/installer/#sdkbox-installing-sdkbox-plugins-using-the-installer
Facebook使い方
http://docs.sdkbox.com/en/plugins/facebook/v3-js/

2
3
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
2
3